HTML DOM入门1：DOM元素的常见方法及其属性
1.HTML DOM简介
DOM指Document Object Model ，文档对象模型，利用DOM可以将html的数据当作对象处理。它的优点是，方便程序和脚本动态地访问、更新文档的内容、结构和样式。
Document对象的继承结构：
1.共同父类是Root Element:<html>
2.子类包括头文件head ,另外还有body 等
DOM包括核心DOM、XML DOM 以及HTML DOM，顾名思义，HTML DOM针对的是HTML文档。
2.HTML DOM 元素（document）的组织形式：节点
HTML DOM把所有内容都看作树中的节点。比如，下面的代码中：
(1)<html>是root，拥有firstChild:<head>和lastChild: <body>
(2)<head>和<body>;<p1>和<p2>互为Sibling.
注意：由于p1和p2之间有一个空格。空格是一个文本。因此body的childNodes个数为三个而非两个。（除了空格之外，换行符、字符、字符串也有类似效果）（但Children个数似乎为2个，待进一步查询）
(3)“文本2”的父节点是<p2>
<html>
<head>
<title>标题</title>
</head>
<body>
<p1>文本1</p1> <p2>文本2</p2>
</body>
</html>
3.节点方法
//document是类名，getElementId是方法，这个方法的作用是寻找特定id的html元素，将返回一个html元素。
var a = document.getElementById("id1");
//类似方法可以利用TagName ClassName寻找，将返回一个节点列表（ID在设计上是唯一的）
var divs = document.getElementsByTagName("div");//标签
var b = document.getElementsByClassName("class1");
var c = document.getElementsByName("input1");//表单通常设计为如<input name="input1">的模式
//其他常见方法包括：（见后续，先介绍节点属性）
4.节点属性
a.节点的属性节点attributes
一个元素（节点）可能有多个属性，如：id为id1，class为class1 align为right
那么，将这三个属性抽象出来当作元素看待，称作属性节点。
如ID属性：它的节点名为id，节点值为id1。有点类似于键值对的思想。
可以通过attributes关键字，可以得到一个元素的属性节点的列表。
var div1 = document.getElementById("id1");//div1是一个元素
var as = div1.attributes;//as是这个元素的属性节点列表，是一个数组。
b.节点名nodeName
<div id="id1">文本内容</div>
var div1=document.getElementById("id1");
//如果是文本节点和文档节点，会返回#text和#document
var a = document.nodeName;//返回#document
//如果是元素节点或者属性节点，等于元素名或属性名
var b = div.nodeName;//返回元素节点的元素名：DIV
var c = div1.attributes[0].nodeName;//返回属性节点的属性名:id
c.节点值nodeValue、节点文本innerHTML
文本节点和属性节点具有节点值。可以初步把节点值理解为往该元素中填充的某种内容。
<div id="id1">文本内容</div>
//内容文本的nodeValue是文本内容
var txt = document.getElementById("id1").childNodes[0].nodeValue;//返回"文本内容"
//也可以用 innerHTML获取文本内容
var txt = document.getElementById("id1").innerHTML;//返回"文本内容"
//而属性节点的nodeValue是属性值
var txt =document.getElementById("id1").attributes[0].nodeName;//返回它的一个属性id的属性值：id1
//document和元素节点的属性值为null
d.节点类型nodeType
一个节点，可能是常见的元素型节点，也可能是文本节点，还有可能是抽象出来的属性节点。描述节点类型的变量称为nodeType.
常见节点的类型有:元素型1，属性节点2，文本节点3，注释8，文档9
<div id="id1">文本内容</div>
var type1 = document.getElementById("id1").nodeType;//由于是一个元素节点，所以会返回1
e.已知某种自定义属性名，获取元素对象的自定义属性值
采用element.attrtibutes[“属性名”]来获得相应的属性元素
//自定义一种属性 property1
<div id="id1" property1="red">文本内容</div>
var value =document.getElementById("id1").attributes["property1"].nodeValue;//返回字符串red