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. cent os 7 与cent os 6区别

    原文地址:https://www.cnblogs.com/Csir/p/6746667.html 前言 centos7与6之间最大的差别就是初始化技术的不同,7采用的初始化技术是Systemd,并行的 ...

  2. Git + Docker + Jenkins自动化部署web到Linux(Centos)

    1.把代码托管到Github上 2.安装Docker 3.安装Jenkins 4.在项目中编写Dockerfile.publish.sh (1)Dockerfile内容 # 基于dotnet基础环境构 ...

  3. c++11の关联容器

    一.关联容器 C++的容器类型可以分为顺序容器和关联容器两大类.对于关联容器,主要有map和set,对于这两种,根据不同的维度,衍生出了8种容器 map                        ...

  4. 关于Net core 的https 设置小知识

    今天我是遇到了一个蛋疼的问题, 就是https 协议, 在创建项目的时候, 我勾选了for  https (如下图), 然后我就在startup.cs 和Kestrel 各种设置还是全部走https ...

  5. Linux安装Sqlite

    下载SQLite源代码sqlite-3.6.23.1.tar.gz 复制sqlite-3.6.23.1.tar.gz到linux上的/usr/src目录 解压源代码 tar -xvzf sqlite- ...

  6. 菜鸟学IT之四则运算升级版

     菜鸟学IT之四则运算升级版 本次作业要求来自:https://edu.cnblogs.com/campus/gzcc/GZCC-16SE1/homework/2213 团队代码github远程仓库的 ...

  7. [转帖]""(双引号) 与''(单引号) 差在哪?

    ""(双引号) 与''(单引号) 差在哪? http://wiki.jikexueyuan.com/project/13-questions-of-shell/double-sin ...

  8. 收藏了8年的PHP优秀资源,都给你整理好了

    https://segmentfault.com/a/1190000018071558 最后更新于 2019.02.12 以下是我整理好的 PHP 资源,各位看官拿去用,不用再自己找了. 每周在 Gi ...

  9. dubbo框架的web端(war)和server端(tar.gz)结合jenkins打包方式

    一.web端程序,打包成war包 jenkins配置 1.项目名称,旧文件处理配置 2.参数构建配置 3.源码库配置 4.打包文件pom.xml配置及多环境打包传参,此处传参qa(表示打测试环境包,名 ...

  10. jQuery的事件处理

    一.页面加载响应事件 $(document).ready()方法,获取文档就绪的时候.他极大地提高了Web相应速度.虽然该方法可以代替传统的window.onload()方法,但是两者之间仍然有差别. ...