CSS rules utilities

functions allowing to get the CSS rules applied to an element

2020-01-27 या दिनांकाला. सर्वात नवीन आवृत्ती पाहा.

This script should not be not be installed directly. It is a library for other scripts to include with the meta directive // @require https://update.greasyfork.org/scripts/394970/768130/CSS%20rules%20utilities.js

Ask a question, post a review, or report the script.

Wrap lines

// ==UserScript==
// @name         CSS rules utilities
// @namespace    http://tampermonkey.net/
// @version      0.3
// @description  functions allowing to get the CSS rules applied to an element
// @author       CoStiC
// @match        *://*/*
// @grant        none
// ==/UserScript==

function findCssRules(el) {
    var sheets = document.styleSheets, ret = [];
    el.matches = el.matches || el.webkitMatchesSelector || el.mozMatchesSelector || el.msMatchesSelector || el.oMatchesSelector;
    for (var i in sheets) {
        var rules = sheets[i].rules || sheets[i].cssRules;
        for (var r in rules) {
            if (el.matches(rules[r].selectorText)) {
                ret.push(rules[r].cssText);
            }
        }
    }
    return ret;
}

function modCssRules(el, newRule, frDoc) {
    if (!frDoc) frDoc = window.document;
    var elHover = "";
    var sheets = frDoc.styleSheets;
    if (el !== null) {
        el.matches = el.matches || el.webkitMatchesSelector || el.mozMatchesSelector || el.msMatchesSelector || el.oMatchesSelector;
        for (var sheet in sheets) {
            var rules = sheets[sheet].rules || sheets[sheet].cssRules;
            for (var rule in rules) {
                if (rules[rule].type === 1) {
                    if (el.matches(rules[rule].selectorText)) {

                        let oldRulesList = rules[rule].style.cssText,
                            oldRules = oldRulesList.split(";"),
                            newRulesList = "";
                        oldRules.pop();

                        for (let newProp in newRule.cssNormal) {
                            el.style[newProp] = newRule.cssNormal[newProp];
                            for (let oldRule of oldRules) {
                                oldRule = oldRule.trim();
                                let oldProp = oldRule.split(":")[0];
                                if (oldProp === newProp) {
                                    newRulesList += newProp + ":" + newRule.cssNormal[newProp] + ";";
                                    el.style[newProp] = newRule.cssNormal[newProp];
                                } else {
                                    newRulesList += oldRule + ";";
                                };
                            }
                            rules[rule].style.cssText = newRulesList;
                        }

                        if (typeof newRule.cssHover !== 'undefined') {
                            var rul = "";
                            for (let propHover in newRule.cssHover) {
                                rul += `${propHover}:${newRule.cssHover[propHover]} !important;`;
                            };
                            elHover = `${rules[rule].selectorText}:hover{${rul}}`;
                        }
                    } else {};
                }
            }
        }
    }

    if (elHover !== "") {
        let newHoverStyle = document.createElement('style'),
            hoverRule = document.createTextNode(elHover);
        newHoverStyle.appendChild(hoverRule);
        document.head.appendChild(newHoverStyle)
        //sheets[sheets.length - 1].insertRule(elHover);
    };
}