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

来源:互联网 发布:我的失恋 知乎 编辑:程序博客网 时间:2024/06/08 06:43

先来简单复习一下

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

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

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

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

 属性节点---》2

 文本节点---》3

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

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

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

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

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

previousElementSibling:上一个兄弟节点

nextElementSibling:下一个兄弟节点

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

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

原创粉丝点击