dom编程学习笔记.docVIP

DOM编程 基本概念 Dom(document object model)文档对象模型。 其实就是将一些标记型的文档以及文档中的内容当成对象。 为什么要将这些文档以及其中的标签封装成对象呢？ 因为可以在对象中定义其属性和行为，可以方便操作这些对象。 b) DOM在封装标记型文档时，有三层模型： DOM1:针对html文档 DOM2:针对xhtml文档 DMO3:针对xhml文档 c) html，xhtml，xml：这些都是标记型文档。 DHTML：是多个技术的综合体。叫做动态的html。 html：负责将数据进行标签的封装。 css：负责标签的样式。 dom：负责将标签以及标签中的数据封装成对象。 javascript：负责通过程序设计方式来操作这些对象。 d)标签之间存在这层次关系： Window |--document html |---head |--title |-base |--link |--meta |--style script |---body |--div |--form |-input |--select |--span |--a |--table |--tbody |--tr |--td |--th |--dl |--dt |--dd 通过这个标签层次，可以形象的看做是一个属性结构。那么也称标记型文档，加载进内存的是一颗DOM树。 这些标签以及标签中的数据都是这棵树上的节点。（一个节点可能有很多子节点，但只能有一个父节点） 当标记型文档加载进内存，那么内存中就有了一个对应的DOM树。 DOM对于标记型文档的解析有一个弊端就是文档过大，相对消耗资源。 对于大型文档可以使用SAX这种方式解析。 e)节点类型： 标签型节点：类型：1 属性节点：类型：2 文本型节点：类型：3 注释型节点：类型：8 document：类型：9 注意：标签之间存在空行时，会出现一个空白的文本节点，在获取节点时一定要注意。 节点的关系： 父节点：parentNode 子节点：childNodes:直接子节点。返回的是一个节点对象数组。 兄弟节点： 上一个兄弟节点：previousSibling 下一个兄弟节点：nextSibling ----------------------------- 获取节点可以通过节点的层次关系完成， 也可以通过document对象完成。 getElementById：通过id属性值获取对应的节点对象。如果有多个id值相同。获取的是第一个id所属对象。 尽量保证ID唯一性。返回的是一个对象。 getElementsByName：通过标签的name属性值获取对象。返回的一堆对象。其实是一个对象数组。 getElementsByTagName。既没有id也没有name时，可以通过标签名来获取节点对象。返回的是一堆对象。 其实是一个对象数组。大多数容器型标签都具备该方法。 利用节点关系访问HTML元素的属性和方法总结如下： Node parentNode：返回当前节点的父节点。 Node previousSibling：返回当前节点的前一个兄弟节点。 Node netxSibling：返回当前节点的后一个兄弟节点。 Node[] childNodes：返回当前节点的所以子节点。 Node firstChild：返回当前节点的第一个子节点。 Node lastChild：返回当前节点的最后一个子节点。----以上全是属性 Node document.getElementById(idVal)：返回文档中中id属性值为idVal的HTML元素。 Node[] document.getElementByTagName(tagName)：返回标签名称为“tagName”的所有节点 Node[] document.getElementByName(name):返回Name属性为“name”的所有节点。 getAttribute（“属性名”）：用来获取属性的值。 setAttribute（“属性名”，“属性值”）：用来设置属性的值。 HTML元素的常用属性和方法 表单元素 action：返回该表单的action属性值。该属性值制定表当的提交地址。 elements：返回表单内全部表单控件所组成的数组。 method：返回表单的method属性。 reset（）：重设表单，将所有表单元素的值设置为初始值。 submit（）：提交表单。 列表框、下来菜单（HTMLSelectElement） form：返回列表框、下拉菜单所在的表单对象。 length：返回列表框、下拉菜单的选项个数。 optio