使用类名选择元素

getElementsByClassName - 使用 className 快速选择 DOM 元素，不支持 IE8 以及低版本浏览器

---

getElementsByClassName()方法返回具有给定类名的元素集合的NodeList。 现代浏览器都支持。 Internet Explorer从版本9开始支持此方法。示例：

var list = document.getElementsByClassName('foo');

// get the number of selected elements
console.log(list.length);

// iterate over elements and output their HTML content
for (var i=0; i<list.length; i++)
    console.log(list[i].innerHTML);
      

和getElementById()函数类似，还可以通过类名称在另一个dom中选择子元素:

var container = document.getElementById('header');
var list = container.getElementsByClassName('foo');
      

Warning: 遍历由类名选择的元素并同时修改类属性，这样做可能会早晨和预期不符合的效果

这个方法很性能很好，但是只能通过类名选择元素，其实用性受到一定的限制。 querySelectorAll()是一种更方便的方法，几乎可以由任意CSS选择器访问DOM元素。