Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

The CSS Rule object

Tags:

javascript

css

According this site externalcss3 The CSS Rule object of the styleSheet object lets you access the individual rules of a stylesheet.

So If I try to run this piece of code(*) on stackoverflow page, using the javascript console, I expect to see some CSS Rules written in 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 something 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 have I Missed? Sorry for my ignorance and your time.

like image 897
underscore666 Avatar asked May 17 '12 18:05

underscore666


People also ask

What is a CSS rule?

A CSS rule is a grouping of one or more CSS properties which are to be applied to one or more target HTML elements. A CSS rule consists of a CSS selector and a set of CSS properties. The CSS selector determines what HTML elements to target with the CSS rule.

What are the three rules of CSS?

Inheritance, the Cascade, and Specificity are the big three. Understanding these concepts will allow you to write very powerful stylesheets and also save time by writing fewer CSS rules.

What is the CSS rule structure?

A Cascading Style Sheet (CSS) rule is a statement that defines the style of one or more elements in your web page. These rules follow a specific structure. The format or syntax for CSS rules consists of a selector and a declaration. A declaration block consists of several declarations for s given selector.


1 Answers

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

Read this thread: Reading the rules of a cross domain CSS file in DOM

like image 69
Joseph Silber Avatar answered Sep 22 '22 13:09

Joseph Silber