JavaScript节点

JavaScript节点
DOM:
document object model（文档对象模型）。
D：文档，xml文档和html文档
O：对象，document对象的属性和方法
M：模型
DOM是针对xml（html）的基于树的API
DOM树：节点（node）的层次
DOM把一个文档表示为一颗家族树，即父亲，兄弟，儿子；DOM定义了node的接口以及许多种节点类型来表示xml节点的多个方面
节点（node)：
根据DOM，html(xml)文档的每个成分都是节点，整个文档是一个文档节点，每个HTML元素是元素节点，包含在HTML元素中的文本就是文本节点，每个HTML属性就是属性节点，注释是注释节点
节点彼此都是等级关系，HTML文档中的节点组成了节点树，文档中的每个元素，属性，文本都是这个树中的一个节点，树起始于文档节点，并由此继续伸展纸条，直至处于这棵树的最底层为止，如图所示：
元素节点：每个HTML标签都是元素节点
文本节点：标签中的文字是文本节点
属性节点：标签的属性是属性节点
重点API
1.getElementById()
1）查询给定ID属性值的元素，返回该元素的元素节点，也是元素对象
2）因为在一个HTML中ID的值是唯一的，所以返回值也是唯一的，所以方法名为getElementById(),而不是getElementsById();
3)该方法只能用于document对象，就像Java的static对象
2.getElementsByName()
1)查找给定name属性的所有元素，这个方法将会返回一个节点集合，也称为对象集合
2）这个集合可以作为一个数组来对待，length属性的值表示的集合的个数
3）因为在html中name不能作为唯一确定的元素，所以方法的名称为getElementsByName(),而不是getElementByName();
3.getElementsByTagName();
1）查询给定标签的所有元素
2）在html中，标签名不是唯一的，所以返回的是节点的集合
3）这个集合可以当作节点来处理，length属性表示这个集合的个数
4）可以有两种形式来执行这个方法：
--- 1 var elements = document.getElementsByTagName();
---2 var elements = element.getElementsByTagName();
从这两个方法里可以看出持有这个方法的不一定是整个文档对象，也可以是元素节点
4、hasChildNodes();
1)这个方法用来判断这个元素是否含有子节点
2）返回值是true或false
3)因为文本节点和属性节点不可能有子节点，所以返回值永远为false
4)如果 hasChildNodes()为false，则childNodes,firstChild,lastChild将返回空数组或者空字符串
5、nodeName
1）文档中每一个节点都会有这个属性
2）为给定节点的名称
3）如果节点是属性节点，nodeName返回的是属性名称，如果节点是元素节点，则返回的是元素名称，如果节点是文本节点，则返回的是#text的字符串
6、nodeType
该节点表明的是节点类型 ，返回值是一个整数
元素节点类型的返回值是1，属性节点的返回值是2，文本节点的值是3
7、nodeValue
1)返回给定点的当前值（字符串）
2）如果给定节点是属性节点，返回值是这个属性的值，如果给定节点是文本节点，返回值是文本节点的内容，如果给定节点是元素节点，返回值是null
3)nodeValue是一个读写属性
8、replaceChild()
1)把一个给定元素里的一个子节点替换为另外一个子节点
2）var reference = element.replaceChild(newChild,oldChild);
返回值指向已经被替换掉的那个子节点的引用
9、getAttribute()
1)返回一个给定元素的给定属性的节点值
2)Var attributeValue = element.getAttribuate(attributeName);
3)给定属性的名字必须以字符串的形式传递给该方法
4)给定属性的值将以字符串的形式返回
10、setAttribute()
1)将给定元素添加到一个新的属性或改变它现有的值
2）element.setAttribute(attributeName,attributeValue);
3）属性的名字和值必须以字符串的形式传递
4）如果这个属性已经存在，那么值将被attributeValue取代
5）如果这个属性不存在，那么先创建它，再给他赋值