jquery - Access content of external css using javascript -
its easy internal css code like:
var css = ''; $('style').each(function(){ css+=$(this).html(); }); now if there external link css file like:
<link href="style.css" /> is there anyway know css codes available using javascript/jquery?
is there anyway know css codes available using javascript/jquery?
yes. there stylesheets collection containing stylesheet objects, of cssstylesheet objects, have cssrules property (just rules on old ie) cssrulelist containing cssrule objects. doesn't matter whether styleshet external (via link) or inline (via style).
example:
var foreach = array.prototype.foreach; foreach.call(document.stylesheets, function(sheet, index) { if (sheet.cssrules || sheet.rules) { log("sheet #" + index); foreach.call(sheet.cssrules || css.rules, function(rule, ri) { log("- rule #" + ri + ": " + rule.csstext); }); } else { log("sheet #" + index + " not cssstylesheet"); } }); function log(msg) { var p = document.createelement('pre'); p.appendchild( document.createtextnode(msg) ); document.body.appendchild(p); } .foo { color: blue; } .bar { color: red; } pre { margin: 0; }
Comments
Post a Comment