css extraction

css-extract.js

function css(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 getStyles(selector) {

                var sheets = document.styleSheets;

                for(let sheet of sheets) {

                                for (let rule of sheet.cssRules) {

                                                if(rule.selectorText === selector){

                                                                return rule.style;

                                                }                                             

                                }

                               

                }

}

 

function getStyleListForElement(el) {

                var appliedCssList = css(el);

                return appliedCssList.map(

                                (cssText)=>{

                                                let selector = cssText.substring(0,cssText.indexOf('{')).trim();

                                                return getStyles(selector);

                                }

                )

}

 

getStyleListForElement(el);