获取:
动态集合:document.getElementsByTagName()--HTMLCollection / document.childNodes
静态集合:document.querySelectorAll()---NodeList
区别:
动态集合会随着dom元素的增加删除而变化
静态集合不会(但是如果dom元素中的内容发生变化会跟着变化,只不过在增加删除dom节点方面不会发生变化)
原因:静态集合是对dom节点的克隆而形成的一个对象,而动态集合对象是一个dom节点的索引
扩展:
类数组:NodeList(返回包含node节点的12中节点) / arguments / HTMLCollection(只返回元素节点) / NodedNameMap(属性节点的集合)
类数组转换成真正的数组方法:
- Array.prototype.slice.call(array-like)
- Array.from(array-like, [mapfn], [thisArg])
- ...array-like