js获取一个元素节点的子节点的方法(包括非文本节点)

先来简单复习一下

1.文档中每个元素、属性、文字、注释、都被看做一个节点对象。

当网页被加载进了内存时,浏览器会为网页创建一个document对象,所有节点都是document对象的子节点。

Node:所有节点对象的父节点

nodeType:节点的类型    元素节点---》1

 属性节点---》2

 文本节点---》3

nodeName:节点的名称  元素节点---》返回全大写标签名

 文本节点---》返回#text

nodeValue:节点的值       元素节点---》null

  文本节点---》返回文本内容

childNodes:获得当前节点对象的所有子节点    返回类型是object  可通过下标访问

previousElementSibling:上一个兄弟节点

nextElementSibling:下一个兄弟节点

2.如何获得一个元素下的子节点,看例子:

<ul id="ul">
    <li>1li>
    <li>2li>
    <li>3li>
    <li>4li>
    <li>5li>
ul>
<script>
    var ul=document.getElementById("ul");
    var child=ul.childNodes;    //此方法获取的节点包括了换行的文本节点text
    console.log(child);
    var childElem=ul.getElementsByTagName("li");  //此方法获取的节点只包括元素节点,通过标签名直接查找
    console.log(childElem);
script>

你可能感兴趣的:(JavaScript)