关于NodeList和HTMLCollection的两三件事
时间:2023-04-05 19:10:08
HTML5
Dom结构如下:
1.dsfs2.dsfs3.dsfs5.dsfsli>
4.dsfs6.dsfs7.dsfs8.dsfs 1.NodeList是querySelectorAll的返回结果2.HtmlCollection是getElementByTagName的结果3.不关心两个数的区别。首先,NodeList是DOM的一个快照,节点的数量和类型,也就是节点的增删改查。NodeList感觉不到,但是修改节点内部内容,是可以感觉到的,比如修改innerHTML;HtmlCollection是活绑定的,节点的增删敏感;4.可写性问题1.直接给NodeList和HtmlCollection赋值是失败的2.元素可读是对dom节点的引用>varef=lis[1]
ef<2.dsfs>lis[1]=ef<2.dsfs>Object.prototype.toString.call(ef)<"[objectHTMLLIElement]"3.然后我想排序NodeList,或者HtmlCollection什么的。既然直接修改很常见,那我先存到数组转换成可行的,然后直接排序>lis=document.querySelectorAll('li');<(8)[li,li,li,li,li,li,li,li]>myDiv.innerHTML=Array.from(lis).sort((a,b)=>parseInt(b.innerHTML)-parseInt(a.innerHTML)).map((item)=>item.outerHTML).加入('');完美的降序排序是使用HTMlCollection实现升序,完美;..]