元素是统称;节点是具有唯一性的;元素节点和文本节点之间存在父子关系,元素节点和属性节点之间不存在父子关系。
元素:
就是html文档里,所有的标签都可以称之为元素,比如说<p>、<tr>等,意思是说元素是个统称,一个文档里面有很多的元素。
节点:
就是js为了对html文档进行操作,而开发的,也就是DOM,文档对象模型。即每个元素都可以称之为一个节点,节点是唯一的。
文档对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理可扩展置标语言的标准编程接口。它是一种与平台和语言无关的应用程序接口(API),它可以动态地访问程序和脚本,更新其内容、结构和www文档的风格(目前,HTML和XML文档是通过说明部分定义的)。文档可以进一步被处理,处理的结果可以加入到当前的页面。DOM是一种基于树的API文档,它要求在处理过程中整个文档都表示在存储器中。另外一种简单的API是基于事件的SAX,它可以用于处理很大的XML文档,由于大,所以不适合全部放在存储器中处理。
1.节点至少拥有以下三个信息:
node Type:节点类型,元素节点类型为1,属性为2,文本为3,注释为8
node Name:节点名称
node value:节点值
2.父节点:parentNode
语法:element.ParentNode
得到的是离元素最近的父节点,如果找不到就返回null
3.子节点:ParentNode.childNodes
获得所有子节点
4.创建节点:document.create.Element()
document.createElement("元素名") 创建元素节点
let div1 = document.createElement('div')
console.log(div1)
document.createTextNode("文本") 创建文本节点
let divText = document.createTextNode('我是div')console.log(divText)
A.appendChild( B) 把B节点追加至A节点的末尾
div1.appendChild(divText)
console.log(div1)
let body = document.querySelector('body')
body.appendChild(div1)
父节点.insertBefore( A,B ) 把A节点插入到B节点之前 */
let gege = document.createElement('button')
let btnText = document.createTextNode('btn的哥哥')
gege.appendChild(btnText)
let didi = document.getElementById('btn1')
body.insertBefore(gege,didi)
创建一个h1 我是h1 插入到 btn的前面 */
}
在 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
一个元素是由开始标签、结束标签以及标签之间的数据构成的
总结:元素是元素节点,是节点中的一种,但元素节点中可以包含很多的节点。