H5带来的新操作方式

querySelectorquerySelectorAll 是H5带来的新的获取Dom元素的方式。

用于替代旧版的document.getElementById``document.getElementsByTagName

querySelector

documen.querySelector() 使用CSS的选择器来进行元素选择,返回匹配到的第一个元素。

代替document.getElementById,如果要获取多个元素需使用documen.querySelectorAll()

querySelectorAll

documen.querySelectorAll()使用CSS的选择器来进行元素选择,返回匹配到的一组元素。

代替document.getElementsByTagName

需要注意的是querySelectorAll()返回的是当前节点的静态节点列表NodeList

它可以可以使用数组的length属性,也可以利用数组的下标形式进行一些操作,但不具备数组所拥有的方法。

querySelectorAlldocument.getElementsByTagName最大的区别是返回的结果不通。

document.getElementsByTagName返回的HTMLCollection是实时更新的

querySelectorAll返回的NodeList是静态的,也就是说在查询的元素集合中添加或删除元素。

HTMLCollection会受到影响,而NodeList不会。