雨夜带刀's Blog

DOM数组去重

之前我在也谈数组去重中介绍了普通的数组去除重复的元素,在选择器的开发过程中,会碰到这样的需求,就是删除一组DOM数组中重复的元素,使用之前的方法肯定行不通,对于 DOM 数组去重,需要另外的处理办法。什么情况下会选取重复的 DOM 元素?下面是一个比较常见的情况,先看 HTML 结构:

<ul>
  <li>test1</li>
  <li>test2</li>
  <li>test3
    <ul>
      <li>测试1</li>
      <li>测试2</li>
    </ul>
  </li>
</ul>

如果是这样的选择器:query( “ul li” ),按照从左到右的查找顺序,会先得到所有 ul 的集合。

[ ul, ul ]

得到了所有 ul 的集合,继续使用 getElementsByTagName 来查找 li,那么第1个 ul 元素就会查找到所有的 li 元素,接下来第2个也会查找到2个 li 元素,最后2个 li 元素就是重复的。这样的情况下,用常规的去重办法要将查找到的所有的 li 元素进行遍历,然后再排序,最后再过滤,这种方法稍后再说。

头像

雨夜带刀

主要折腾前端
现居北京