CSS Rule Object

According to this externalcss3 site, the CSS Rule of the styleSheet object allows you to access individual style sheet rules.

So, if I try to run this piece of code (*) on the stackoverflow page using the javascript console, I expect to see some CSS rules written on this page http://cdn.sstatic.net/stackoverflow/all.css?v=04e0337352b3 .

(*)

var mysheet=document.styleSheets[0]
var myrules=mysheet.cssRules? mysheet.cssRules: mysheet.rules
for (i=0; i<myrules.length; i++) {
     console.log(myrules[i].selectorText.toLowerCase());
}

Actually the result of console.log is different from what I would expect:

object[type="application/x-shockwave-flash"], object[type="application/futuresplash"], object[data*=".swf"], object[src*=".swf"], embed[type="application/x-shockwave-flash"], embed[type="application/futuresplash"], embed[src*=".swf"]

What did I miss? Sorry for my ignorance and your time.

+5
source share
1 answer

It seems you can only access the rules in the CSS file if they are from the same domain.

Read this topic: Reading Cross-Domain CSS File Rules in the DOM

+5
source

All Articles