HTML DOM里，所有都是一个节点：
文档本身是一个文档节点；
所有HTML元素是一个元素节点；
所有HTML属性是属性节点；
HTML元素中的文本都是文节点；
注释是注释节点；

1.获取元素

1.1. getElementById(Id)    Id值必须放在双引号或单引号里面

这个方法返回给定Id属性值的元素节点对应的对象。Id在document里面是独一无二的，所以这个方法对应着document对象里一个独一无二的元素。因为用不着文档里的每一个元素都定义着一个独一无二的Id值，太小题大做了。DOM提供了另一个方法来获取那些没有Id属性的对象。

(1) 如果没有含有这个Id的元素，则返回空；

(2) 如果多个元素都有这个特定的Id，那么该方法返回第一个元素；

1.2. getElementsByTagName(tag)

这个方法返回一个对象数组，每个对象分别对应着文档里有着给定标签的一个元素。通配符也可以作为getElementsByTagName(tag)的参数，getElementsByTagName("*")。

1.3. getElementsClassName(class)

这个方法返回一个具有相同类名的元素的数组。

总结：

1.一份文档就是一颗节点树。

2.节点分为不同的类型：最常用的就是元素节点、属性节点和文本节点。

3.getElementById将返回一个对象，该对象对应着文档里的一个特定的元素节点。

4,。getElementByTagName 和getElementByclassName将返回一个对象数组，它们分别对应着文档里的一组特定的元素节点。

5.每个节点都是一个对象。

2.获取和设置属性

2.1 getAttribute

格式：object.getAttribute(attribute)

getAttribute方法不属于document对象，所以不能与document对象调用，它只能通过节点元素对象调用。

如果attribute不存在，返回null(表示不存在)。

2.2 setAttribute

格式：object.setAttribute(attribute, value)

 1 <input value="OK">
 2         <p>Click the button below to change the input field to an input button.</p>
 3         <button onclick="myFunction()">Try it</button>
 4         <p>IE 8 and earlier does not support the setAttribute method.</p>
 5 
 6         <script>
 7             function myFunction(){
 8                 document.getElementsByTagName("INPUT")[0].setAttribute("type", "button");
 9             }
10         </script>
View Code