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 而调用函数时,是在函数后面写上括号和实参的, ...
随机推荐
- Areas（区域）
Areas(区域) 原文:Areas作者:Dhananjay Kumar 和 Rick Anderson翻译:耿晓亮(Blue)校对:许登洋(Seay) Areas 是 ASP.NET MVC 用来将 ...
- PADS故障解决
1. 点击PADS后就会出现以下: "The directory pointed by the FileDir INI file entry cannot be found.Aborting ...
- Web应用的组件化（二）
管控平台 在上一篇中我们提到了组件化的大致思路,这一篇主要讲述在这么做之后,我们需要哪些外围手段去管控整个开发过程.从各种角度看,面对较大规模前端开发团队,都有必要建立这么一个开发阶段的协作平台. 在 ...
- SQL操作（增删改查）
1.一些重要的SQL命令: SELECT - 从数据库中提取数据UPDATE - 更新数据库中的数据DELETE - 从数据库中删除数据INSERT INTO - 向数据库中插入新数据CREATE D ...
- 【HDU 3652】 B-number （数位DP）
B-number Problem Description A wqb-number, or B-number for short, is a non-negative integer whose de ...
- [转贴]实践:C++平台迁移以及如何用C#做C++包装层
终于有个C++ 如何调用C#类库的文章,收藏之 在前面,我们看过OpenTK与MOgre,这二个项目都是C#项目,但是他的实现都是C++.他们简单来说就是一个包装层.常见的包装方式有二种,一 种就是我 ...
- 115太酷了，居然出了个TV版客户端
确实,智能电视代表了未来的方向,是智能家居的最重要客户端,TV也能做很多事情呢!!不要忘了这个市场,想想什么服务在TV上是最需要的? http://pc.115.com/tv.html
- Android UI 设计准则
Design Principles 设计准则 These design principles were developed by and for the Android User Experienc ...
- SYS_CONTEXT 详细用法
SELECT SYS_CONTEXT ('USERENV', 'TERMINAL') terminal, SYS_CONTEXT ('USERENV', 'LANGUAGE') lang ...
- oracle命中率模型计算
命中率模型是在owi之前比较常用的一种诊断性能问题的方法,通过命中率的计算,发现系统中的一些设置是否合理,当命中率不高的时候,通过调整一些参数和设置,提高命中率,有效的提高系统的性能和吞吐量.但当系统 ...