认识HTML DOM

HTML DOM是针对HTML文档的标准模型。它定义了所有HTML元素的对象和属性，以及访问它们的方法。也就是说，HTML DOM是关于如何获取、修改、添加和删除HTML元素的标准。
一、 HTML DOM的属性和方法
1、HTML DOM的属性有以下几种：
（1）获取和设置节点(元素)的文本值(内容)的innerHTML属性；
（2）获取和设置节点的父节点的parentNode属性；
（3）获取和设置节点的子节点的childNodes属性；
（4）获取和设置节点的属性节点的attributes属性。
（5）规定节点的名称的nodeName属性；
（6）规定节点的值的nodeValue属性；
（7）获取节点的类型的nodeType属性。
注意：
（1）nodeName、nodeValue和nodeType等属性都是只读的；
（2）元素节点的nodeName与标签名相同，它的nodeValue是undefined或者null，它的nodeType是1；
（3）属性节点的nodeName与属性名相同，它的nodeValue是属性值，它的nodeType是2；
（4）文本节点的nodeName是#text，它的nodeValue是它本身，它的nodeType是3；
（5）文档节点的nodeName是#document，它的nodeType是9；
（6）注释节点的nodeType是8；
（7）nodeName始终包含HTML元素的大写字母标签名。
2、document的方法有以下几种：
（1）获取文档中包含带有指定类名的所有元素的节点列表的getElementsByClassName()方法。
（2）获取带有指定id的元素的getElementsById()方法。
（3）获取文档中包含带有指定标签名称的所有元素的节点列表（集合/节点数组）的getElementsByTagName()方法。
（4）把新的子节点添加到指定节点的appendChild()方法。
（5）删除子节点的removeChild()方法。
（6）替换子节点的replaceChild()方法。
（7）在指定的子节点前面插入新的子节点的insertBefore()方法。
（8）获取指定的属性值的getAttribute()方法。
（9）把指定的属性设置或修改为指定的值的setAttribute()方法。
（10）创建属性节点的createAttribute()方法。
（11）创建元素节点的createElement()方法。
（12）创建文本节点的createTextNode()方法。
二、HTML DOM document对象
1、每一个载入了浏览器的HTML文档都是Document对象，而Document对象让我们可以从脚本中对HTML页面中的所有元素进行访问。注意：Document对象是Window对象的一部分，我们可以通过window.document属性对其进行访问。
2、document对象的集合具有以下几种：
（1）提供对文档中所有HTML元素的访问的all[]集合；
（2）获取文档中所有Anchor对象的引用的anchors[]集合；
（3）获取文档中所有Applet对象的引用的applets集合；
（4）获取文档中所有Form对象的引用的forms[]集合；
（5）获取文档中所有Image对象的引用的images[]集合；
（6）获取文档中所有Area和Link对象的引用的links[]集合；
3、document对象的属性具有以下几种：
（1）提供对元素的直接访问的body属性。它对于定义了框架集的文档是引用最外层的的。
（2）获取或设置与当前文档相关的所有cookie的cookie属性。
（3）获取下载当前文档的服务器域名的domain属性。
（4）获取文档被最后修改的日期和时间的lastModified属性。
（5）获取载入当前文档的文档的URL的referrer属性。
（6）获取当前文档的标题的title属性。
（7）获取当前文档的URL的URL属性。
注意：
（1）cookie属性是一个可读写的字符串，我们可以通过使用它对当前文档的cookie进行创建、读取、修改和删除操作。
（2）domain属性是一个只读的字符串，它包含了载入当前文档的Web服务器的主机名。并且可以解决因同源安全策略带来的不同文档的属性共享问题。
（3）如果referrer属性不是通过超级链接访问当前文档的，则为null。它允许客户端通过
JavaScript访问HTTP引用头部。
（4）URL属性在一般情况下，它的值是与Window对象的location.href属性相同的。但是它在
URL重定向发生的时候，保存的是文档的实际URL，而location.href属性保存的是请求的URL。
4、document对象的方法具有以下几种：
（1）获取带有指定名称的对象集合的getElementsByName()方法。
（2）获取对拥有指定id的第一个对象的引用的getElementsById()方法。
（3）获取带有指定标签名的对象集合的getElementsByTagName()方法。
（4）向文档写入HTML表达式或JavaScript代码的write()方法。它只接受单个字符串作为参
数，但可以有多个参数（exp1,exp2,exp3,…），所有参数将按照顺序被追加到文档中。
（5）等同于write()方法，但要在每个表达式之后写一个换行符的writeln()方法。
（6）打开一个用来收集来自任何document.write()或document.writeln()方法的输出的流的
open()方法。
（7）关闭用document.open()方法打开的输出流，并显示选定的数据的close()方法。
注意：
（1）write()方法在文档载入和解析的时候，允许一个脚本向文档中插入动态生成的内容。
（2）我们通常按照两种方式使用write()方法：一是在使用该方法在文档中输出HTML；二是在调用该方法的窗口之外的窗口、框架中产生新文档。在第二种方式中，必须使用close()方法来关闭文档。
（3）getElementsByName()方法是查询元素的name属性，而一个文档中的name属性不是唯一
的，因此它返回的是一个数组。
（4）getElementsByTagName()方法返回元素的顺序是元素在文档中的顺序。我们要知道，传递
给getElementsByTagName()方法的字符串是可以不区分大小写的。
（5）当我们调用open()方法打开一个新文档并且用write()方法设置文档内容后，必须用close()
方法关闭文档，并迫使其内容显示出来。我们要注意，属于被覆盖的文档的一部分的脚本或事件
句柄不能调用open()方法，因为脚本或事件句柄自身也会被覆盖。
（6）close()方法会关闭用document.open()方法打开的文档流，并强制地显示出所有缓存的输
出内容。当我们使用write()方法动态的输出一个文档时，必须要调用close()方法，以确保所
有文档内容都能显示出来。当我们调用了close()方法后，就不可以再次调用write()方法，因
为这样会隐式的调用open()方法来擦除当前文档并打开一个新的文档。