共计 1360 个字符,预计需要花费 4 分钟才能阅读完成。
Dom: 英文全称-Document Object Model 译成中文即是:文档对像模型.听起来很术语,其实就是文档内容的结构关系.文档类型可以是 HTML 或 XML
Dom 具有对 Html 文件和 XML 文件元素的访问控制能力,简单点说利用 Dom 可以对某个 html 或 xml 文件添加,修改,删除元素.更改其现有的结构或内容.
如果你未接触过 Dom,你会发现 Dom 太神奇了...不管你是菜鸟还是高手,在这个注重用户体验的 web 设计时代里,Dom 是至关重要的. 如果你是一名有经验的 web 设计者,你应该看到过或用过以下这些命令或方法 getElementById getElementsByTagName offsetParent appendChild getAttribute 不过至今仍有人认为这些都是 JavaScript 中的东西,其实不然,这些全是 Dom 中很重要的方法!我保证 web 圈提供的 dom 手册将是本世纪函盖面最广,涉及 dom 内容最全最详细的.仔细阅读吧年轻的程序员,相信他对你会有帮助!
Dom 可以在网页中做什么?
HTML Dom 中最常用的几个方法之查找元素
- Dom 之引用当前整个网页文档:document
- Dom 如何快速在网页中查找某一元素:getElementById
- Dom 中查找一组标签,具有相同名称的标签元素:getElementsByTagName
- 根据标签的 Id 属性值或 name 属性来查找多个元素:getElementsByName
Dom 中创建,添加,删除,修改,替换,复制,网页中的标签和文本内容的方法如下.
- 在网页中的创建一个标签元素:createElement
- 创建一段文本内容:createTextNode
- 向网页中添加元素:appendChild
- 删除元素的 Dom 方法是:removeChild
- 修改网页中标签元素的属性:setAttribute
- 替换已存在的标签或元素:replaceChild
- 复制克隆已存在的标签或元素:cloneNode
- 获取和修改元素内的 html 标签与文本内容:innerHTML
- 获取或修改元素的文本内容,仅支持 IE:innerText
- 获取或修改元素的文本内容,支持 FF:textContent
HTML Dom 中还专门提供了一组接口用来操作网页中的表格 Table 元素
- HTML Dom 中的 insertRow 方法可以为表格增加一行
- 删除表格中一行的方法是:deleteRow
- HTML Dom 中的 insertCell 方法可以为表格某行中增加一列
- 删除行中的一列的方法是:deleteCell
- HTML Dom 中的 createCaption 方法可以为表格创建一个标题
- HTML Dom 中的 createTHead 方法可以为表格创建一个 Thead
- HTML Dom 中的 createTFoot 方法可以为表格创建一个 TFoot
- 引用表格中所有行的属性为:rows
- 引用表格中某行的所有列:cells
- 移动表格中的行,只支持 IE:moveRow
Dom 中操作父元素,子元素,兄弟元素的相关命令
- 获取父元素的指令是:parentNode
- 获取元素中第一个子元素:firstChild
- 获取元素中最后面的那个子元素:lastChild
- 获取元素中所有的子元素:childNodes
- 获取前一个兄弟元素:previousSibling
- 获取后一个兄弟元素 |:nextSibling
正文完