JS中Node节点总结
Node的三个基本属性:
1.nodeType:表明节点类型,1是元素节点,3是文本节点。
2.nodeName: 表明节点名称,元素节点为标签名,文本节点为#text。
3.nodeValue:表明节点值,元素节点为null,文本节点为文本内容。
Node的节点关系:
1.parentNode与childNodes
parentNode寻找当前节点的父节点,childNodes寻找当前节点的子节点,其中包括文本节点和元素节点(特别需要注意空白的文本节点也算是节点)如下程序
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>childNodes.length</title>
</head>
<body>
<ul id="ul">
<li></li>
<li></li>
<li></li>
</ul>
<script>
var oUl=document.getElementById('ul');
alert(oUl.childNodes.length);//是7不是3
</script>
</body>
</html>
2:firstChild与lastChild
分别对应父节点的第一个节点与最后一个节点,firstChild相当于childNodes[0]或childNodes.item(0)。
3.nextSibling与previousSibling
分别对应当前节点的前一个节点与当前元素的后一个节点。
Node的操作节点:
Node的操作节点有appendChild(),insertBefore(),replaceChild(),removeChild(),cloneNode(),normalize()
1.appendChild(newNode)是将newNode添加到当前节点的最后一个子节点的后面,如果newNode已经是文档的一部分,则appendChild操作相当于剪切;若果newNode是新创造的节点,则appendChild操作相当于添加。
2.insertBefore(newNode,oldNode)是将newNode添加到当前节点的oldNode子节点的前面,如果insertBefore(newNode,null),则insertBefore()的操作和appendChild()一样。
3.replaceChild(newNode,oldNode)是将oldNode替换为newNode,不过oldNode的所有关系指针newNode也都继承下来。
4.removeChild(oldNode)是删除oldNode节点。
5.cloneNode(true/false)是将已知节点复制一份,如果为true,包括子节点,若果为false,不包括子节点。然后通过appendChild(),insertBefore(),replaceChild()将其添加到文档中。
6.normalize()是将空文本节点删除或将相邻的文本节点合并为一个文本节点。
JS中Node节点总结的更多相关文章
- js中DOM 节点的一些操作方法
什么是DOM DOM:文档对象模型.DOM 为文档提供了结构化表示,并定义了如何通过脚本来访问文档结构.目的其实就是为了能让js操作html元素而制定的一个规范. DOM就是由节点组成的. 解析过程 ...
- js中的节点遍历+类数组对象
firstChild 第一个子元素 lastChild 最后一个子元素 childNodes[n] = childNodes.item(n) 第n+1个子元素 parentNode ...
- 原生JS中DOM节点相关API合集
节点属性 Node.nodeName //返回节点名称,只读 Node.nodeType //返回节点类型的常数值,只读 Node.nodeValue //返回Text或Comment节点的文本值,只 ...
- js中属性节点的应用
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- JS中插入节点的方法appendChild和insertBefore的应用
1.appendChild() 方法:可以向节点的子节点列表的末尾添加新的子节点.比如:appendChild(newchild)括号里可以是创建的标签var newchild = document. ...
- JS中Text节点总结
文本节点有Text类型表示,包含的是可以找字面解释的纯文本内容.纯文本中可以包含转移后的HTML字符,但不能包含HTML代码.Text节点具有以下属性: 1.nodeType的值为3. 2.nodeN ...
- JS中Document节点总结
document对象是documentHTML的一个实例,也是window对象的一个属性,因此可以将document对象作为一个全局对象来访问. Document节点的子节点可以是DocumentTy ...
- js中对节点属性的操作和对节点的操作
常用的节点属性操作方法 1.setAttribute(name,value):给某个节点添加一个属性 2.getAttribute(name):获取某个节点属性的值. 3.removeAttribut ...
- Kubernetes容器集群管理环境 - Node节点的移除与加入
一.如何从Kubernetes集群中移除Node比如从集群中移除k8s-node03这个Node节点,做法如下: 1)先在master节点查看Node情况 [root@k8s-master01 ~]# ...
随机推荐
- spring之bean
Bean的基本配置 id属性 id属性确定bean的唯一标识符,容器对bean的管理,访问,以及该bean的依赖关系,都通过该属性来完成.bean的id属性在Spring容器中应该是唯一的. clas ...
- T_SQL编程赋值、分支语句、循环
咱们在C#中会常用到赋值.循环.分支语句什么的 今天咱们来看下当初在C#用到的一点东西放到SQL中是怎么使用的 创建变量 在C#中创建一个值类型变量很简单 int a:这就可以了 SQL: decla ...
- 海康/大华 IpCamera RTSP地址和格式
海康:rtsp://[username]:[password]@[ip]:[port]/[codec]/[channel]/[subtype]/av_stream说明:username: 用户名.例如 ...
- 用eclipes 添加jboss tools中的hibernate tool进行反向工程生成数据库对应的BOJO(Javabean)
用eclipes 添加jboss tools中的hibernate tool进行反向工程生成数据库对应的BOJO(Javabean) 安装: 在help中eclise marksplace中查询JBo ...
- 【转载】c语言数据的左移右移
原文地址:http://www.cnblogs.com/myblesh/articles/2431806.html 由于在飞控程序中执行效率对程序的影响相当大,所以一个好的运算效率很重要.左移右移比单 ...
- Android 新一代多渠道打包神器
欢迎大家关注腾讯云技术社区-博客园官方主页,我们将持续在博客园为大家推荐技术精品文章哦~ 作者:李涛 ApkChannelPackage是一种快速多渠道打包工具,同时支持基于V1签名和V2签名进行多渠 ...
- MATLAB下跑Faster-RCNN+ZF实验时如何编译自己需要的external文件
本篇文章主讲这篇博客中的(http://blog.csdn.net/sinat_30071459/article/details/50546891)的这个部分,如图所示 注:截图来自 小咸鱼_ 的博客 ...
- DirectFB 之 分段动画
动画动态配置 一套素材的目录结构一般如下: 子目录中的图片名称都是以数字命名,比如,1,2, 3, 4,-- 而配置文件animation.cfg的格式如下: #width height ...
- poj1990树状数组
Every year, Farmer John's N (1 <= N <= 20,000) cows attend "MooFest",a social gather ...
- Integer浅谈
别BB,亮代码. 结果: 结果分析: 1.true 相信大家对第一个的比较结果应该不意外,只是单纯的数值比较 2.true 这个和第三个结果一比较起来就感觉迷惑了,明明两个都是同样的赋值方式,为什么一 ...