元素是统称;节点是具有唯一性的;元素节点和文本节点之间存在父子关系,元素节点和属性节点之间不存在父子关系。
元素:
就是html文档里,所有的标签都可以称之为元素,比如说<p>、<tr>等,意思是说元素是个统称,一个文档里面有很多的元素。
节点:
就是js为了对html文档进行操作,而开发的,也就是DOM,文档对象模型。即每个元素都可以称之为一个节点,节点是唯一的。
文档对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理可扩展置标语言的标准编程接口。它是一种与平台和语言无关的应用程序接口(API),它可以动态地访问程序和脚本,更新其内容、结构和www文档的风格(目前,HTML和XML文档是通过说明部分定义的)。文档可以进一步被处理,处理的结果可以加入到当前的页面。DOM是一种基于树的API文档,它要求在处理过程中整个文档都表示在存储器中。另外一种简单的API是基于事件的SAX,它可以用于处理很大的XML文档,由于大,所以不适合全部放在存储器中处理。
第一种function insertEle() { var oTest = document.getElementById("box-one")var newNode = document.createElement("div")var reforeNode = document.getElementById("p1")newNode.innerHTML = " This is a newcon "oTest.insertBefore(newNode,reforeNode.nextSibling)//新建的元素节点插入id为P1节点元素的后面。 }
第二种// 自定义函数向后插入function insertAfter( newElement, targetElement){ var parent = targetElement.parentNode if ( parent.lastChild == targetElement ) {// 如果最后的节点是目标元素,则直接添加。因为默认是最后parent.a( newElement ) } else {//如果不是,则插入在目标元素的下一个兄弟节点的前面。也就是目标元素的后面parent.insertBefore( newElement, targetElement.nextSibling ) }}
在 HTML DOM (文档对象模型)中,每个部分都是节点:文档本身是文档节点
所有 HTML 元素是元素节点
所有 HTML 属性是属性节点
HTML 元素内的文本是文本节点 (包括回车符也是属于文本节点)
注释是注释节点
Element 对象可以拥有类型为元素节点、文本节点、注释节点的子节点。
NodeList 对象表示节点列表,比如 HTML 元素的子节点集合。
元素也可以拥有属性。属性是属性节点。
<bookstore>
<book category="children">
<title lang="en">Harry Potter</title>
<author>J K. Rowling</author>
<year>2005</year>
<price>29.99</price>
</book>
<book category="cooking">
<title lang="en">Everyday Italian</title>
<author>Giada De Laurentiis</author>
<year>2005</year>
<price>30.00</price>
</book>
</bookstore>
元素和节点的区别:元素是一个小范围的定义,必须是含有完整信息的节点才是一个元素。
比如:<author>......./<author>是一个元素。而<author>是一个子节点或者是元素节点,Vaidyanathan Nagarajan是一个文本节点。
换句话说就是 元素一定是节点,但节点不一定是元素。
node(节点)是相对Tree这种数据结构而言的。Tree就是由Node组成。
element则是xml里面的概念,<xxx>就是元素,是xml中数据的组成部分之一。
DOM将文档中的所有都看作节点node>element
一个元素是由开始标签、结束标签以及标签之间的数据构成的
总结:元素是元素节点,是节点中的一种,但元素节点中可以包含很多的节点。