![飞机杯](/f/yejiang.png)
![飞机杯](/f/yejiang.png)
07/18
2024
如果有两个或多个处在同一层级的元素,怎么用 JavaScript 判断它们的先后顺序呢?可以使用 compareDocumentPosition API。
下面是个简单的示例:
const compareValue = a.compareDocumentPosition(b)
if (compareValue == 2) {
// b 在前
} else if (compareValue == 4) {
// b 在后
} else if (compareValue == 0) {
// a 就是 b 元素自身
} else {
// 其它位置关系
}
这是我在张鑫旭大神的博客看到的:DOM节点文档前后位置判断
当时我在给本站的文章添加章节导航,文章里有多个 H3 和 H4 标题,它们全都是平级的,并且互相之间还夹杂着其他元素。我要按照它们出现的顺序进行处理,所以就需要比较元素的先后顺序。搜到上面的办法之后就很简单了。
我写了个 Demo:compareDocumentPosition.html
如果你有更好的方法也欢迎在评论区留言~
文章里添加的章节导航:
JavaScript 使用 compareDocumentPosition 判断两个元素的位置关系(前后顺序)
-
Google Chrome 126
Windows
-
Google Chrome 126
Windows
我也想搭建一个和大佬一样的博客,有学习的推荐吗QAQ (比较小白,但是也会一点点)
-
Google Chrome 126
Windows
是想要和大佬一样内容的博客,还是一样系统框架的博客呢?
-
h3和h4是平级的话,这样本身就有些不合理。还是应该从文章上就要规范化。