javascript - getElementById vs. getElementsByTagName

Question

Basic question.

document.getElementById("yy").onmouseover = hi;
//document.getElementsByTagName("li").onmouseover = hi;
...

In this example, http://jsfiddle.net/8fURz/1/ why does the first line work, but not the second line (when it is un-commented, of course)?

I know I can do this easily with jQuery, just wonderin...

Answer 1

Because document.getElementsByTagName("li") return a NodeList, you need to bind event handler to every element of the NodeList.

var list = document.getElementsByTagName("li");
for (var i= 0; i < list.length; i++) {
  list[i].onmouseover = hi;
}