Question

I’d like to be able to step through every embedded resource in a web page — CSS style sheets, external JavaScript files, images, iframes, etc. — and then do some stuff with them with JavaScript.

I can target them all separately, but I wonder if there isn’t a more generic way. Some built-in method or library that lets you walk through the DOM and interact with these kinds of embedded resources.

Is there?

Answer 1

There are a lot of ways to gather DOM elements, but the most common are the following:

document.body
document.getElementById()
document.getElementsByTagName()
document.getElementsByClassName()
document.querySelectorAll()

---

If you want to get all elements, without formal structure, you can do:

//non-standard
document.all

//or
document.getElementsByTagName('*');

Also, there is Sizzle, which is the selector engine used by jQuery. It uses CSS selectors to target elements. Or if possible, use jQuery, which hosts a lot of DOM traversal and manipulation methods.