1:节点:nodeType,nodeValue,nodeName

getAttributeNode() 方法从当前元素中通过名称获取属性节点。

元素节点nodeValue是null,属性节点nodeValue是名值

<h1 id="a">123456</h1>
<script>
var oH1 = document.getElementById("a"); //元素节点1
var oTxt = oH1.firstChild; //文本节点3
var oId = oH1.getAttributeNode("id"); //属性节点2
//1,3,2
console.log("nodeType: "+oH1.nodeType+","+oTxt.nodeType+","+oId.nodeType);
//null,123456,a
console.log("nodeValue: "+oH1.nodeValue+","+oTxt.nodeValue+","+oId.nodeValue);
//H1,#text,id
console.log("nodeName: "+oH1.nodeName+","+oTxt.nodeName+","+oId.nodeName);
</script> 

2:children和childNodes区别
chilren返回元素列表(不包含空格,非标准属性但兼容好):console.log(oDiv.children)


childNodes返回节点列表(不包含空格标准属性HTML DOM):console.log(oDiv.childNodes)


<div id="aa">
<h1>123456</h1>
<p>qwrert</p>
</div>
3:nextElementSibling和nextSibling区别
node.nextSibling/node.nextElementSibling
nextSibling:找下一个节点,以Node对象返回,包含空格(HTML DOM) 找不到返回Null
nextElementSilbing: 找下一个元素节点,不包含空格,但IE8及以下不支持。

SW:HTML DOM的更多相关文章

  1. HTML DOM(一):认识DOM

     分类: HTML/JavaScript/CSS(10)  版权声明:本文为博主原创文章,转载请注明出处http://blog.csdn.net/ghsau. 什么是DOM?       通过 Jav ...

  2. JavaScript 是如何工作:Shadow DOM 的内部结构 + 如何编写独立的组件!

    这是专门探索 JavaScript 及其所构建的组件的系列文章的第 17 篇. 如果你错过了前面的章节,可以在这里找到它们: JavaScript 是如何工作的:引擎,运行时和调用堆栈的概述! Jav ...

  3. 小tips:HTML DOM中的children和childNodes属性

    childNodes 属性 标准的,childNodes 属性返回节点的子节点集合,以 NodeList 对象.包括HTML节点,所有属性,文本.可以通过nodeType来判断是哪种类型的节点,只有当 ...

  4. 走进DOM:HTML DOM

    DOM(Document Object Model)即文档对象模型.针对HTML和XML 文档的API(应用程序接口). DOM描绘了一个层次化的节点树,执行开发者加入.移除和改动页面的某一部分.当然 ...

  5. Qt 学习之路 2(60):使用 DOM 处理 XML

    Qt 学习之路 2(60):使用 DOM 处理 XML  豆子  2013年8月3日  Qt 学习之路 2  9条评论 DOM 是由 W3C 提出的一种处理 XML 文档的标准接口.Qt 实现了 DO ...

  6. AngularJS:HTML DOM

    ylbtech-AngularJS:HTML DOM 1.返回顶部 1. AngularJS HTML DOM AngularJS 为 HTML DOM 元素的属性提供了绑定应用数据的指令. ng-d ...

  7. virtual DOM的作用:将DOM的维护工作由系统维护转交给virtual DOM维护

    virtual DOM的作用:将DOM的维护工作由系统维护转交给virtual DOM维护 两个方面:对应用端 & 对DOM端(渲染准备的计算) 1.将DOM状态的维护工作由系统维护转交给vi ...

  8. 浏览器端-W3School-HTML:HTML DOM Video 对象

    ylbtech-浏览器端-W3School-HTML:HTML DOM Video 对象 1.返回顶部 1. HTML DOM Video 对象 Video 对象 Video 对象是 HTML5 中的 ...

  9. 浏览器端-W3School-HTML:HTML DOM Textarea 对象

    ylbtech-浏览器端-W3School-HTML:HTML DOM Textarea 对象 1.返回顶部 1. HTML DOM Textarea 对象 Textarea 对象 Textarea ...

随机推荐

  1. html&css学习笔记----YJZJZQA

    HTML表单: (

  2. Scrapy框架-Spider

    目录 1. Spider 2.Scrapy源代码 2.1. Scrapy主要属性和方法 3.parse()方法的工作机制 1. Spider Spider类定义了如何爬取某个(或某些)网站.包括了爬取 ...

  3. jpa使用过程中出现问题记录[持续更新]

    1.自定义JPQL语句,出现Not supported for DML operations 错误. 解决方案:在@Query注解上面加上@Modifying注解. //出现问题的代码 @Query( ...

  4. 我的Scala之路(1):列表List操作

    List() 或 Nil 空 List List("Cool", "tools", "rule) 创建带有三个值"Cool",&q ...

  5. 在Linux系统安装Nodejs 最简单步骤

    1.去官网下载和自己系统匹配的文件: 英文网址:https://nodejs.org/en/download/ 中文网址:http://nodejs.cn/download/ 通过  uname -a ...

  6. 016_python程序变量抽取配置的几种方式

    一.json配置文件 json文件的互转,如下例子: 配置文件:example.json { "mysql":{ "host":"localhost& ...

  7. 三。Hibernate 注解形式

    Hibernate支持JPA注解的jar包 JPA全称: Java Persistence API JPA和Hibernate之间的关系,可以简单的理解为JPA是标准接口,Hibernate是实现. ...

  8. shell脚本解压多个jar包

    for m in "GATEWAY" "ORDER" "PAY"do cd /home/cpay/tomcat${m}/ROOT/WEB-I ...

  9. 使用RAP2和Mock.JS实现Web API接口的数据模拟和测试

    最近一直在思考如何对Web API的其接口数据进行独立开发的问题,随着Web API的越来越广泛应用,很多开发也要求前端后端分离,例如统一的Web API接口后,Winform团队.Web前端团队.微 ...

  10. windows安全更新程序(KB4093112) 安装失败 错误0x80070011

    解决办法:win + R → 输入regedi 将默认安装路径改回C盘的program files