What is the difference between cssRules rule objects and rules?

What's the difference between:

document.styleSheets[0].cssRules 

and

 document.styleSheets[0].rules 

I noticed that the second is also supported by IE8 and the previous one. But what is the difference between these two objects?

+12
javascript css document
source share
2 answers

A CSS rule is an object of a StyleSheet object that allows you to access and modify individual style sheet rules.

IE and Firefox are different when implementing a CSS Rule object, although, fortunately, the difference is mainly in the syntax:

document.styleSheets [0] .cssRules [0] // access to the first rule in Firefox document.styleSheets [0] .rules [0] // access to the first rule in IE Win

As already mentioned, IE and Firefox rely on two different CSS Rule objects to access style sheet rules. Two objects are listed below:

enter image description here

0
source share

The cssRules and rules objects are created using the same steps. Therefore, they lead to the same object. rules are outdated and are provided only for compatibility with existing sites.

To answer your question, there is no difference whatsoever. The cssRules object cssRules officially supported, and the rules are deprecated.

See https://drafts.csswg.org/cssom/#legacy-css-style-sheet-members for more information.

0
source share

All Articles