Professional JavaScript For Web Developers

Chapter 6
DOM Example
What color do you like?
Red
Green
Blue
This page asks the user which color he/she likes. The radio buttons all have the same name, because you
only want to return one value for this field, which is the value attribute of the selected radio button. To
get references to all the radio button elements, you can use the following code:
var oRadios = document.getElementsByName(“radColor”);
You can then manipulate the radio buttons the same way as you can any other element:
alert(oRadios[0].getAttribute(“value”)); //outputs “red”
Internet Explorer 6.0 and Opera 7.5 have a couple of bugs when using this method.
First, they also return elements that have an id equal to the given name. Second,
they only check and elements.
getElementById()
The second method defined by the HTML DOM is getElementById(), which returns an element with
its id attribute set to a specific value. In HTML, the id attribute is unique — meaning that no two elements
can share the same id. This is undoubtedly the fastest method of retrieving a single specific element
from the document tree.
Suppose you have the following HTML page:
DOM Example
Hello World!
This is my first layer
172