how does one get every element in a window into an array?

[lawrence]

I've a graphic designer who wants to be able to see what he's styled
and what he so far hasn't. So I'd like to write a script that will
work in, say, FireFox, so that he can point FireFox at has websites
and the script will loop through the page after its loaded and perhaps
for each element do something like throw an alert() with the style
rules. I can call the style() method on each element to get its rules,
but how do I get every element?

 

[Michael Winter]

[snip]

So I'd like to write a script that will work in, say, FireFox, so that
he can point FireFox at has websites and the script will loop through
the page after its loaded and perhaps for each element do something like
throw an alert() with the style rules.

If he's got Firefox or Mozilla, bring up the DOM Inspector from the Tools
menu. It will show the document tree. From the right-hand pane, you can
select various catagories of information to display, including CSS rules.
Click the element on the left to show the selectors that match that
element, then the selector on the right to show the rules.

It can confuse itself sometimes, so if that happens, close the inspector
and open a new instance.

I can call the style() method on each element to get its rules, but how
do I get every element?

document.getElementsByTagName('*')

will retrieve a collection containing every element in the document.

Mike

 

[Rob B]

I can call the style() method...

Think you mean the Style object. You can read its properties, but it
won't help much if they've been set in a separate (outside the element
tag) stylesheet; pretty much returns empty strings. That's because it's
an actual DOM object, and if you don't set its properties directly, via
HTML's "style" attribute, or the object itself with JS, the values don't
"cascade" down the DOM hierarchy as the actual implementation of those
styles does. Here's one solution:

http://dhtmlkitchen.com/learn/js/setstyle/index4.jsp

Uses the DOM document.defaultView.getComputedStyle() method or IE's
proprietary .currentStyle property.

You'll probably find some use for Steve Chipman's excellent favelets at
slayeroffice.com - particularly MODI and Style Sheet Viewer.

http://slayeroffice.com/index.php