JavaScrip节点类型之Element节点

学掌门网校

JavaScrip节点类型之Element节点


基本概念

Element类型用于表现HTML元素，提供了对元素标签名、子节点及属性的访问。

Element节点的基本属性

nodeType的值为1
nodeName的值为元素的标签名
nodeValue的值为null
parentNode可能是Document或Element

*其中nodeName属性返回的标签名在HTML中始终都是以大写表示；nodeName也可以使用tagName属性替代。
Element节点的常用属性
element.childNodes：

元素的childNodes属性中包含了它的所有子节点，这些子节点有可能是元素、文本节点、注释或处理指令，这意味着在执行某项操作以前，通常都要先检查一下nodeTpye属性。

例子：

• <div>
• <p>0</p>
• <p>1</p>
• <p>2</p>
• </div>
• var div=document.getElementsByTagName('div')[0]
• for(var i=0,len=div.childNodes.length;i<len;i++){
• if(div.childNodes.nodeType===1){
• alert(div.childNodes.innerHTML)
• }
• }
• //输出：0/1/2
  

[color=rgb(51, 102, 153) !important]复制代码
element.children：

children属性与childNodes的唯一区别是：children只返回元素中同样还是元素的子节点。
*IE8及更早版本的children属性中也会包含注释节点。

---

由于元素间的空格，导致了在使用childNodes和firstChild等属性时的行为不一致，
为了弥补这一差异为DOM元素添加了以下5个属性：
childElementCount：返回子元素（不包括文本节点和注释）的个数。
firstElementChild：指向第一个子元素；firstChild的元素版。
lastElementChild：指向最后一个子元素；lastChild的元素版。
previousElementSibling：指向前一个同辈元素；previousSibling的元素版。
nextElementSibling：指向后一个同辈元素；nextSibling的元素版。

element.innerHTML：

在读模式下，innerHTML属性返回与调用元素的所有子节点（包括元素、注释和文本节点）对应的HTML标记。在写模式下，innerHTML会根据指定的值创建新的DOM树，然后用这个DOM树完全替换调用元素原先的所有子节点。
*通过innerHTML插入

相关课程推荐：

Java测试开发组合课（零基础起点）

课程简介：
适合“零”编码基础，对编码感兴趣，想从事软件自动化测试并以测试开发为主要目标的各类IT及非IT人士。

课程主要包含三大块内容：零基础学编程Java语言直通车、Selenium2（WebDriver）入门到精通、Appium移动端app自动化测试高手修炼班

整套课程以项目实战为主，99.99%纯代码实战演练，注重编码能力，框架思维的养成，进入企业可快速上手，轻松融入自动化测试团队，合作承担企业核心自动化测试任务。

适合人群：
→即将毕业，打算进入软件测试领域，以测试开发为目标的在校学生
→在职手工测试人员期望转型以编码为主的自动化测试开发

课程链接
http://www.atstudy.com/classroom/11/introduction
Java测试开发组合课（有Java基础）

课程简介：
适合了解面向对象编程语言的特点，对Java基本语法结构有所了解，有简单Java基础的各类在职人士或在校学生，同时能以测试开发为职业发展目标，善于通过编码，框架设计结合现有的自动化工具/框架来实现企业内不同项目的自动化测试任务；

课程主要包含三大块内容：面向Java的测试开发从入门到实战，Selenium2（WebDriver）入门到精通，Appium移动端app自动化测试高手修炼班；

整套课程以项目实战为主，99.99%纯代码实战演练，注重自动化框架设计能力，结合敏捷思维进行需求拆分的能力，以测试驱动开发为主导的理念，为测试开发职业发展打下扎实的基础，同时进入企业可快速上手，轻松融入现有自动化测试团队，能够独立承担企业核心自动化测试任务。

适合人群：
→有Java基本语法基础的各类人士
→希望能够熟练掌握一门语言并且在测试中发挥最佳作用
→希望迅速培养实战型自动化测试开发人才的企业用户

课程链接
http://www.atstudy.com/classroom/12/introduction

了解更多课程内容及课程安排，可咨询QQ 2852509883 或致电客服 021-63333120（工作日9:00-17:30）

海海豚

谢谢分享~

jingzizx

清晨一缕阳光

顶一个！