Web API 接口参考Node之Node.nextSibling

最新推荐文章于 2023-06-03 09:02:48 发布

cellinlab

最新推荐文章于 2023-06-03 09:02:48 发布

阅读量355

点赞数

分类专栏：前端基础文章标签： Node Node.nextSibling webAPI

本文链接：https://blog.csdn.net/funkstill/article/details/103696040

版权

前端基础专栏收录该内容

167 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
</head>
<body>
  <div class="description">
    <p>
      Node.nextSibling 是一个只读属性，返回其父节点的 childNodes 列表中紧跟在其后面的节点，如果指定的节点为最后一个节点，则返回 null。
    </p>
    <p>
      在两个标签之间（即一个元素的闭合标签之后，下一个元素的起始标签之前）有空白出现时，会有#text 节点被插入到 DOM 中。使用 document.write 语句插入的两个元素之间不会有空白。
    </p>
  </div>
  <div class="demo">
    <div id="div-01">Here is div-01</div>
    <div id="div-02">Here is div-02</div><div id="div-03">Here is div-03</div>
  </div>
  <script>
    var el = document.getElementById('div-01').nextSibling,
         i = 1;

    console.log('Siblings of div-01:');

    while (el) {
      console.log(i + '. ' + el.nodeName);
      el = el.nextSibling;
      i++;
    }
  </script>
</body>
</html>