As stated earlier, everything on a page (including attributes) is a node. Unlike what you might have thought, attributes are not considered to be children of the element they apply to. Here, we'll look at how to retrieve, set, and remove attributes. Consider this sample element:

<iframe id="myIFrame" src="aDog.html" align="center" width="400" height="200"></iframe>

This can be accessed through document.getElementById("myIFrame"). Now, let's take a look at how to access the attributes of this element.

getAttribute(attribute) takes one argument, the attribute to retrieve, and returns it's value. Example:
document.getElementById("myIFrame").getAttribute("width")
would return "400"

setAttribute(attribute, newValue) takes two arguments, the attribute whose value you want to change (or create), and it's new value. Example:
document.getElementById("myIFrame").setAttribute("width","200")
Now, myIFrame's width is 200. Note the use of quotes even on integers. This is because element attributes should always be a string (although they'll usually accept it even if it's not a string). We could also change this <iframe>'s src attribute with:
document.getElementById("myIFrame").setAttribute("src","someNewPage.html")

removeAttribute(attribute) takes one argument, the attribute to be removed. Example:
document.getElementById("myIFrame").removeAttribute("width")
would remove the "width" attribute, and it would set it to the browser's default width for <iframe>'s.

And that's really all there is to know about attributes without going into very boring and gory details on them. Now, let's see how we can create element nodes out of thin air.

Next -->