CSS Rules and DOM
in [JavaScript]
|
Prev: Acronym or abbreviation? (was: solution for IE6 .setAttribute bug?)
Next: Dynamicly add dropdown lists to a form populated with php/mysql query
From: David Mark on 24 Dec 2008 17:05 On Dec 24, 4:47 pm, JR <groups_j...(a)yahoo.com.br> wrote: > Hi David, sorry I didn't see your comments before reposting the No need to apologize. That is the nature of Usenet (my post may not have been available when you posted.) > snippet. I agree with you in some points. Just answering partially to > Nathan's question: > > "[..] I'm looking for a way to query the DOM to determine which CSS > rules apply to a particular element." > > Well, what I tried to tell with my code is: > > a) in FF3 and Safari 3.x, loop around window.getComputedStyle(element, > null) object. Safari has a specific method (getPropertyValue) to > retrieve the values from the object's properties; I believe that most quasi-standard browsers have that as it is the standard way to query computed styles. However, the "getPropertyValue" method has bugs in some older versions, so a lot of scripts don't use it. ISTM that these bugs can be tested, but I don't know of a reason to do so (the corresponding properties of the returned object work fine in my experience.) IIRC, the standard method requires the hyphenated forms of the names as well (which I never use in scripts.) > > b) in IE7, loop around element.currentStyle. > > Obviously, as results may vary depending on browser version and > platform (win / mac), it's better to check for a specific style than > to looping around the styles object. It is best to understand when and why they will vary. The rules are simple and have nothing to do with versions or platforms. For example: div.myclass { border-left: .2em } The computed style of these div's will be in pixels. The cascaded style will be ".2em". Similar deviations occur with float, position and display rules. http://www.w3.org/TR/CSS21/visuren.html#dis-pos-flo [snip]
From: SAM on 25 Dec 2008 13:16 Le 12/23/08 5:35 PM, Martin Honnen a �crit : > Nathan Davis wrote: > >> I'm looking for a way to query the DOM to determine which CSS rules >> apply to a particular element. Solutions that are cross-browser >> compatible are preferred, but not absolutely necessary. Does anyone >> have any suggestions? I've spent several hours on this, but can't >> seem to find the answer. > > Well current browsers expose > document.styleSheets > and then IE/Win exposes > document.styleSheets[i].rules > and W3C DOM Level 2 compliant browsers expose > document.styleSheets[i].cssRules > Then you can check the selector of each rule but there is no API as far > as I know telling you whether a rule applies to a certain element. And how makes FireBug ? (FireBug is an extension for FireFox) (the code of such an extension (xml and js) is in 'clear' once you've unziped it) -- sm
From: SAM on 25 Dec 2008 13:19
Le 12/23/08 6:57 PM, Nathan Davis a �crit : > > how they do the CSS introspection Firebug? Just unzip it and have a look in ? -- sm |