JavaScript children和childNodes

来源：互联网发布：windows 平板电脑吧编辑：程序博客网时间：2024/06/05 19:45

children属性，它返回的是 HTMLCollections（子元素集合）。

 <div id="box">             <ul>                 <li>1</li>             </ul>             <ul>                 <li>2</li>             </ul>             <ul>                 <li>3</li>             </ul>             <ul>                 <li>4</li>             </ul>         </div>         <script type="text/javascript">                var box=document.getElementById("box");                console.log("box.children的长度="+box.children.length);                console.log(box.children);        </script>

box里第一级子元素的长度

IE6-IE8都支持children属性，但返回的是元素节点和注释节点，IE9以上都返回的只是元素节点。
这里写图片描述

childNodes属性，它返回的是 NodeList（子节点集合）。

<div id="box">             <ul>                 <li>1</li>             </ul>             <ul>                 <li>2</li>             </ul>             <ul>                 <li>3</li>             </ul>             <ul>                 <li>4</li>             </ul>         </div>         <script type="text/javascript">                var box=document.getElementById("box");                console.log("box.childNodes的长度="+box.childNodes.length);                console.log(box.childNodes);        </script>

5个text就是4个ul前后间的空格（空格类型为文本节点）

childNodes属性浏览器基本都支持：
这里写图片描述

阅读全文

0 0