10-DOM模型与DOM API.docVIP

DOM（Document Object Model）被称作文档对象模型，它是语言和平台中立的接口，允许程序和脚本动态访问和更新文档的内容，结构和风格。在AJAX中，DOM对于我们来说是HTML 和 XML 文档的一个应用程序接口，它可以把HTML，XML与AJAX中的开发语言Javascript连接起来。Javascript中的DOM实现可以使得我们在AJAX中通过Javascript代码对HTML和XML数据进行DOM方式的操作，从而做到页面的动态修改更新和数据的提取处理。 DOM与HTML： html标签对应的是dom中的元素节点。html中的文本内容都是dom中的文本节点。html中的注释信息对应dom树中的注释节点。html标签中的属性对应dom树的属性节点。在DOM眼中，HTML是由很多不同类型的节点组成的，这些节点都属于NODE对象。NODE对象有一个nodeType的属性可用于判断节点类型：元素节点是HTML中最常见的节点，页面中的body,input,div都是元素节点。属性节点表示的是一个元素节点的某个属性，例如input中的value属性就可以被看作一个属性节点。文本节点表示HTML页面中的一段文字信息，例如divHello World/div，其中的”Hello World”就是一个文本节点。注释文本节点也比较好理解，HTML的注释信息，!—Comment Message--比如这样一段内容就是一个注释文本节点。根节点顾名思义，表示的是HTML的根，在Javascript中有一个特殊的对象document，它可以表示HTML的根节点，后面我们会介绍这个特殊对象有很多在AJAX中非常常用的方法。 根节点的属性和方法：属性：documentElement 表示文档的根元素节点。在HTML文档中，它表示html这个标签代表的元素节点方法：createAttribute() 用指定名字创建新的Attr节点对象。方法参数为属性的名字createComment() 用指定的字符串创建新的Comment节点对象。方法参数为注释信息createElement() 用指定的标记名创建新的Element节点对象。方法参数为节点标签的名字createTextNode() 用指定的文本创建新的文本节点对象。方法参数为文本信息getElementById() 返回文档中具有指定id属性的Element节点。方法参数为节点的id属性值getElementsByTagName() 以数组方式返回文档中具有指定标记名的所有Element节点，其顺序为在文档中出现的顺序。标记名指的是像body,table这样的HTML标记名称。方法参数为标记名称Element节点对象的常用方法都是对节点属性的操作：属性：tagName 元素的标记名字，例如table元素的标记名字为table。HTML文档返回的标记名字均为大写。方法：getAttribute() 以字符串形式返回指定属性的值。方法参数为属性名称getAttributeNode() 以Attr节点对象的形式返回指定属性的值。方法参数为属性名称getElementsByTabName() 以数组方式返回当前元素节点的子孙节点中中具有指定标记名的所有Element节点，其顺序为在文档中出现的顺序。 方法参数为节点的标记名hasAttribute() 如果该元素具有指定名字的属性，则返回trueremoveAttribute() 从Element节点中删除指定的属性。方法参数为属性的名称removeAttributeNode() 从Element节点的属性列表中删除指定的Attr节点。方法参数为属性的名称setAttribute() 把指定的属性设置为指定的字符串值，如果该属性不存在则添加一个新属性方法的第一个参数为属性的名称。方法的第二个参数为属性的值setAttributeNode() 把指定的Attr节点添加到该元素的属性列表中。方法的参数为Attr节点对象属性节点的属性：name 属性名value 属性值Node对象的属性和方法如下所示 ：属性：attributes 表示该节点的所有属性节点对象的数组 childNodes 表示当前节点的子节点的数组。如果没有子节点，则返回空数组 firstChild 返回当前节点的第一个子节点。如果没有子节点，则返回null lastChild 返回当前节点的最后一个子节点。如果没有子节点，则返回null nextSibling 返回当前节点的下一个兄弟节点。如果没有这样的节点，则返回null previousSibling 返回当前节点的上一个兄弟节点。