查阅了一些资料,总结一下DOM。
DOM是W3C(万维网联盟)的文档对象模型中立于文档和语言的接口,它允许程序和脚本动态访问和更新文档的内容、结构和样式。
HTML DOM定义了所有HTML元素的对象和属性,以及访问它们的方法。通俗点说,HTML DOM就是关于如何获取、修改、添加或删除HTML元素的标准。
在HTML DOM中,所有事物都是节点,而DOM则为节点树,而每个节点都拥有包含着关于节点某些信息的属性这些属性是nodeName(节点名称)、nodeValue(节点值)和nodeType(节点类型),HTML DOM就是在这些节点上执行的方法或者动作。
如图所示:
HTML DOM方法和属性:
一些常用的 HTML DOM 方法:
-
getElementById(id) - 获取带有指定 id 的节点(元素)
-
appendChild(node) - 插入新的子节点(元素)
-
removeChild(node) - 删除子节点(元素)
一些常用的 HTML DOM 属性:
-
innerHTML - 节点(元素)的文本值
-
parentNode - 节点(元素)的父节点
-
childNodes - 节点(元素)的子节点
-
attributes - 节点(元素)的属性节点
方法 | 描述 |
---|---|
getElementById() | 返回带有指定 ID 的元素。 |
getElementsByTagName() | 返回包含带有指定标签名称的所有元素的节点列表(集合/节点数组)。 |
getElementsByClassName() | 返回包含带有指定类名的所有元素的节点列表。 |
appendChild() | 把新的子节点添加到指定节点。 |
removeChild() | 删除子节点。 |
replaceChild() | 替换子节点。 |
insertBefore() | 在指定的子节点前面插入新的子节点。 |
createAttribute() | 创建属性节点。 |
createElement() | 创建元素节点。 |
createTextNode() | 创建文本节点。 |
getAttribute() | 返回指定的属性值。 |
setAttribute() | 把指定属性设置或修改为指定的值。 |