JavaScript中childNodes、children、nodeValue、nodeType、parentNode、nextSibling详细讲解
其中属性、元素（标签）、文本都属于节点
<title></title>
<scripttype="text/javascript">
window.onload= function () {
//找d1的所有子节点
//1childNodes获取所有的子节点获取文本节点和元素节点
vard1 = document.getElementById("d1");
for(i=0;i<=d1.length;i++)
//alert(d1.childNodes[i].nodeName); //将会返回所有的文本节点和元素节点
document.body.removeChild(d1);
// for (var i = 0; i< d1.childNodes.length; i++) {
// //节点 node
// //当时文本节点的时候
// if(d1.childNodes[i].nodeType == 3) {
// alert(d1.childNodes[i].nodeValue);
// }
// }
//d1.nodeValue//获取节点的值 只能获取文本节点的值
属性节点 3文本节点
//children 获取子节点只获取元素节点 只有ie支持
// for (var i = 0; i< d1.children.length; i++) {
// alert(d1.children[i]);
// }
//2parentNode父节点
//element元素节点
//node 所有类似的节点 文本属性 元素
// var d11 =document.getElementById("d11");
// var d = d11.parentNode;
// alert(d.id);
//3兄弟节点 Sibling兄弟姐妹
//nextSibling 下一个兄弟节点
// var d2 =document.getElementById("d2");
// var d =d2.nextSibling;
// alert(d.id);
//
// var dd =d2.previousSibling;//上一个兄弟节点
// alert(dd.id);
}
</script>
</head>
<body>
<divid="d1">
d1
<!--123-->
<divid="d11">d11
<div>steee</div>
<div>steee</div>
</div>
<divid="d12">d12</div>
<divid="Div1">d13</div>
</div>
<divid="d2">
d2<divid="d22"></div>
</div>
<divid="d3">
d3<divid="d33"></div>
</div>
</body>
</html>
JavaScript中childNodes、children、nodeValue、nodeType、parentNode、nextSibling详细讲解的更多相关文章
- JavaScript 中函数节流和函数去抖的讲解
JavaScript 中函数节流和函数去抖的讲解 我们都知道频繁触发执行一段js逻辑代码对性能会有很大的影响,尤其是在做一些效果实现方面,或者逻辑中需要进行后端请求,更是会导致卡顿,效果失效等结果,所 ...
- Javascript 中childNodes和children的区别
<!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...
- javascript中的变量作用域以及变量提升详细介绍
在javascript中, 理解变量的作用域以及变量提升是非常有必要的.这个看起来是否很简单,但其实并不是你想的那样,还要一些重要的细节你需要理解变量作用域 “一个变量的作用域表示这个变量存在的上下文 ...
- javascript中childNodes与children的区别
1.childNodes:获取节点,不同浏览器表现不同: IE:只获取元素节点: 非IE:获取元素节点与文本节点: 解决方案:if(childNode.nodeName=="#text&qu ...
- JavaScript中childNodes和children的区别
我在学习JavaScript对DOM操作的过程中,发现了使用childNodes属性,得不到我想要的结果,因此我就从JavaScript高级程序设计中了解了childNodes和children的区别 ...
- JavaScript之childNodes属性、nodeType属性学习
1.childNodes属性:在一颗节点树上,childNodes属性可以用来获取任何一个元素的所有元素,它是一个包含这个元素所有子元素的数组. <body> <script typ ...
- Java中UIManager的几种外观的详细讲解
Java'中的几种Look and Feel 1.Metal风格 (默认) String lookAndFeel = "javax.swing.plaf.metal.MetalLookAnd ...
- linux 中解压与压缩 常用操作详细讲解
平时有时候 会在服务器进行一些文件的操作,比如安装一些服务与软件等等,都有解压操作,一般在 导出一些简单的服务器文件,也是先压缩后再导出,因此,在这里根据平时用到解压与压缩命令的频率来记录下: 1.最 ...
- jQuery中$(function()与(function($)等的区别详细讲解
(function($) {-})(jQuery); 这里实际上是匿名函数,如下: function(arg){-} 这就定义了一个匿名函数,参数为arg 而调用函数时,是在函数后面写上括号和实参的, ...
随机推荐
- microsoft office visio基本使用方法
以下是画流程图.程序内存分配等等框图用到的点滴使用方法,记录在这里以备偶尔只需. 1.画大括号“{}” 在Visio操作界面下,依次点击“文件(File)”—“形状(Shapes)”--“其他Visi ...
- arm-linux-gcc中对“inline”的处理
C++对于关键字“inline”的处理大家都知道,C++编译器对于内敛函数就是把它当做一个宏展开.这样可能会增加程序的代码量,却可以减少程序入栈和出栈的此处,从而影响程序的执行速度.但是,C语言中扩展 ...
- C#中判断bool 类型 代码的最短写法
看到一个关于写最短代码的, 是一个bool类型判断的: public bool IsNull(object val) { if (val == null) { return true; } e ...
- The CircuitCalculator.com Blog a blog with live web calculators Home About Policies Contact PCB
PCB Trace Width Calculator 转载自:CircuitCalculator.com 关键词: PCB,Layout,电流,导线宽度. This Javascript web ca ...
- bzoj 3052: [wc2013]糖果公园 带修改莫队
3052: [wc2013]糖果公园 Time Limit: 250 Sec Memory Limit: 512 MBSubmit: 506 Solved: 189[Submit][Status] ...
- ubuntu系统下创建软件桌面快捷方式
转自ubuntu系统下创建软件桌面快捷方式 默认情况下,ubuntu会将自动安装的软件快捷方式保存在/usr/share/applications目录下,如果我们要创建桌面快捷方式,只需要右键-复制- ...
- Word Puzzles
poj1204:http://poj.org/problem?id=1204 题意:给你n*m的字符串矩阵,然后p个查询,每个查询会给出一个字符串,然后问你在矩阵中能否通过8个方向搜索到这个字符串,输 ...
- WINDOWS下，中文JSON格式读取报错处理：ValueError: No JSON object could be decoded
File "C:\Python27\lib\json\__init__.py", line 290, in load **kw) File "C:\Python27\li ...
- Jquery UI dialog 传参
[一篮饭特稀原创,转载请注明出自http://www.cnblogs.com/wanghafan/p/3519318.html] $("#dialog").dialog({ aut ...
- [wikioi]奇怪的梦境
http://wikioi.com/problem/2833/ 拓扑排序,居然1A,哈哈. #include <cstdio> #include <iostream> #inc ...