Via Css隐藏规则日志

格式化CSS规则，检测哪些规则生效，并输出匹配日志。
目前为 2025-03-09 提交的版本。查看最新版本。
换行
// ==UserScript==
// @name         Via Css隐藏规则日志
// @namespace    https://viayoo.com/
// @version      2.0
// @license      MIT
// @description  格式化CSS规则，检测哪些规则生效，并输出匹配日志。
// @author       Copilot
// @run-at       document-idle
// @match        *://*/*
// @grant        GM_registerMenuCommand
// @require      https://cdn.jsdelivr.net/npm/[email protected]/js/lib/beautify-css.js
// ==/UserScript==

(function() {
    'use strict';

    // 获取CSS文件URL
    function getCssFileUrl() {
        const currentHost = window.location.hostname;
        return `https://${currentHost}/via_inject_blocker.css`;
    }

    // 格式化CSS内容
    function formatCss(rawCss) {
        try {
            return css_beautify(rawCss, {
                indent_size: 2,
                selector_separator_newline: true
            });
        } catch (error) {
            console.error(`CSS格式化失败：${error.message}`);
            return null;
        }
    }

    // 提取有效选择器
    function extractValidSelectors(rule) {
        if (!rule.selectorText) return [];
        const selectors = rule.selectorText.split(',').map(selector => selector.trim());
        return selectors.filter(selector => {
            try {
                document.querySelector(selector);
                return true;
            } catch {
                return false;
            }
        });
    }

    // 检测生效的CSS规则
    function checkActiveRules(sheet) {
        const activeRules = [];
        if (!sheet || !sheet.cssRules) return activeRules;

        for (const rule of sheet.cssRules) {
            if (rule.selectorText) {
                const validSelectors = extractValidSelectors(rule);
                validSelectors.forEach(selector => {
                    const elements = document.querySelectorAll(selector);
                    if (elements.length > 0) {
                        activeRules.push({
                            selector,
                            count: elements.length
                        });
                    }
                });
            }
        }

        return activeRules;
    }

    // 检查CSS文件
    async function checkCssFile() {
        const cssFileUrl = getCssFileUrl();

        try {
            const response = await fetch(cssFileUrl);
            if (!response.ok) {
                alert(`无法加载CSS文件: ${cssFileUrl} (状态码: ${response.status})`);
                return;
            }

            const rawCss = await response.text();
            if (!rawCss.trim()) {
                alert("CSS文件为空！");
                return;
            }

            // 格式化CSS
            const formattedCss = formatCss(rawCss);
            if (!formattedCss) {
                alert("CSS格式化失败！");
                return;
            }

            // 创建临时样式表并检测规则
            const styleElement = document.createElement('style');
            styleElement.textContent = formattedCss;
            document.head.appendChild(styleElement);

            const activeRules = checkActiveRules(styleElement.sheet);
            document.head.removeChild(styleElement); // 移除临时样式表

            if (activeRules.length > 0) {
                let resultMessage = `检测完成！共有 ${activeRules.length} 条规则生效:\n\n`;
                activeRules.forEach((rule, index) => {
                    resultMessage += `${index + 1}. 匹配规则: ##${rule.selector}\n`;
                    resultMessage += `匹配到的元素数: ${rule.count}\n\n`;
                });
                alert(resultMessage);
            } else {
                alert("没有发现生效的CSS规则！");
            }
        } catch (error) {
            console.error("获取CSS文件失败：", error);
            alert("获取CSS文件失败，请检查网络连接或CSS文件！");
        }
    }

    // 注册菜单命令
    GM_registerMenuCommand("检测CSS隐藏规则", checkCssFile);
})();