首页 > 代码库 > 文档对象模型Dom
文档对象模型Dom
为使我们能够通过编程的方式控制网页，W3C提出了文档对象模型（Document Object Mode-DOM），浏览器通过文档对象模型DOM使Javascript程序可以访问网页上的任何元素，而DOM是网页上XHTML中文档正文的标题、段落、列表、样式、ID、class以及所有其它出现的数据的一个内部表示。
DOM的主要思想是HTML上每个元素对应于DOM中的一个节点。DOM定义了许多种节点类型来表示节点的多个方面如：
1.文档节点Document——最顶层的节点或者说是根节点，它代表整个HTML文档，所有的其它节点都是附属它的。每个Web文档都是一个文档节点。
2.文档类型节点DocumentType——DTD引用的对象表现形式它不包含子节点。
3.元素节点Element——表示起始标记和结束标记之间的内容，它是唯一可以同时包含属性和子节点的节点类型。
4.文本节点Text——代表HTML文档元素的起始标记和结束标记之间，或者CData Section内容包含的普通文本。这个节点类型不能包含子节点。
5.属性节点Attr——代表元素节点开始标记内指定的属性。这个节点不包含任何子节点。
6.注释节点Comment--代表注释，这个节点不包含任何子节点。
在DOM树中，每个节点可以有零个到多个子节点，而每个子节点只能有一个父节点。
属性/方法 | 类型/返回类型 | 说明 |
nodeName | String | 节点的名字；根据节点的类型定义 |
nodeValue | String | 节点的值；根据节点的类型定义 |
nodeType | Number | 节点的类型常量值之一 |
ownerDocument | Document | 指向这个节点所属的文档 |
firstChild | Node | 指向在childNodes列表中的第一个节点 |
lastChild | Node | 指向在childNodes列表中的最后一个节点 |
childNodes | NodeList | 所有子节点列表 |
previousSibling | Node | 指向前一个兄弟节点，若该节点就是第一个兄弟节点，则该值为null |
nextSibling | Node | 指向后一个兄弟节点，若该节点就是最后一个兄弟节点，则该值为null |
hasChildNodes() | Boolean | 当childNodes包含一个或多个节点时，返回真 |
attributes | NameNodeMap | 包含了代表一个元素的特性的Attr对象，仅用于Element节点 |
appendChild(node) | Node | 将node添加到childNodes的末尾 |
removeChild(node) | Node | 从childNodes中删除node |
replaceChild(newnode,oldnode) | Node | 将childNodes中的oldnode替换成newnode |
insertBefore(newnode,refnode) | Node | 在childNodes中的refnode之前插入newnode |
访问指定节点的方法有：
1.getElementsByTagName（）——用来返回一个包含所有的tagName（标记名）特性等于某个指定值得元素的NodeList。
2.getElementsByName（）——用来获取所有name值等于指定值得元素。
3.getElementById（）——它将返回id特性等于指定值得元素。
创建和操作节点：
1.createAttribute（name）——用给定的名称name创建特性节点。
2.createComment（text）——创建包含文本text的注释节点。
3.createElement_x（tagname）——创建标记名为tagname的元素。
4.createTextNode（text）——创建包含文本text的文本节点。
5.createDocumentFragment()--创建文档碎片节点。
createElement()——用指定的标记名创建新的Element节点。
createTextNode()——用指定的文本创建新的TextNode节点。
appendChild()——通过把一个节点增加到当前节点的childNodes[]组，给文档树增加节点。
removeChild()——从文档树中删除并返回指定的子节点。
replaceChild()——从文档树中删除并返回指定的子节点，用另一个节点替换它。
insertBefore()——给文档树插入一个节点，位置在当前节点的指定子节点之前。如果该节点已经存在，则删除之再插入到它的位置。
createDocumentFragment()——创建一个文档碎片，把所有的新节点附加其上，然后一次性的把文档碎片的内容添加到document中。
cloneNode()——复制当前节点，或者复制当前节点以及它的所有子孙节点。
操作文本节点:
1.appendData(string):将字符串添加在文本节点的文本尾部.
2.deleteData(offset,count):删除文本节点中从指定位置开始的指定数量的字符.
3.insertData(offset,string):将指定字符串插入到文本节点指定的位置中.
4.replaceData(offset,count,string):用给定的字符串替换文本节点指定位置指定数量的文本数据.
5.splitText(offset):将指定位置的文本节点分成两个部分，将右边的部分返回为一个新的文本节点，将左边的部分留在原始位置.
6.substringData(offset,count):从文本节点的文本数据中返回指定位置指定数目的字符串.
table方法
<table/>元素添加内容：
caption——指向<caption/>元素
tBodies——<tbody/>元素的集合
tFoot——指向<tfoot/>元素
tHead——指向<thead/>元素
rows——表格中所有行的集合
createTHead()——创建<thead/>元素并将其放入表格
createTFoot()——创建<tfoot/>元素并将其放入表格
createCaption()——创建<caption/>元素并将其放入表格
deleteTHead()——删除<thead/>元素
deleteTFoot()——删除<tfoot/>元素
deleteCaption()——删除<caption/>元素
deleteRow(position)——删除指定位置上的行
insertRow(position)——在rows集合中的指定位置上插入一个新行
<tbody/>元素添加内容：
rows——<tbody/>中所有行的集合
deleteRow(position)——删除指定位置上的行
insertRow(position)——在rows集合中的指定位置上插入一个新行
<tr/>元素添加内容：
cells——<tr/>元素中所有的单元格的集合
deleteCell(position)——删除指定位置上的单元格
insertCell(position)——在cells集合中的指定位置上插入一个新的单元格
文档对象模型Dom