首页 > 代码库 > HTML DOM学习------简单介绍
HTML DOM学习------简单介绍
DOM:w3c文档对象模型。
是中立于平台和语言的接口,它允许程序和脚本动态地访问和更新文档的内容、结构和样式。
HTML DOM :定义了所有 HTML 元素的对象和属性,以及访问它们的方法。
换言之,HTML DOM 是关于如何获取、修改、添加或删除 HTML 元素的标准。
DOM节点:HTML文档中所有内容都是节点:
整个文档是一个文档节点;
每个HTML元素是一个元素节点;
HTML元素内的文本是一个文本节点;
每个HTML属性是一个属性节点;
注释是注释节点;
HTML DOM将HTML文档视为树结构,这种结构被称为节点树。
节点树中的节点彼此拥有层次关系。(父节点,子节点,同胞节点)
节点树中顶端节点被称为根节点。
根节点没有父节点;
一个父节点可以有多个子节点。
HTML DOM 方法:
可以通过Javascript语言(或者其他编程语言)对HTML DOM进行访问。
所有HTML元素被定义为对象,而编程接口则为对象方法(比如添加或修改元素)
和对象属性(比如节点的名称或内容)。
属性:
innerHTML属性:获取和替换元素的内容
nodeName属性:nodeName 是只读的
元素节点的 nodeName 与标签名相同
属性节点的 nodeName 与属性名相同
文本节点的 nodeName 始终是 #text
文档节点的 nodeName 始终是 #document
nodeValue属性:nodeValue 属性规定节点的值。
元素节点的 nodeValue 是 undefined 或 null
文本节点的 nodeValue 是文本本身
属性节点的 nodeValue 是属性值
nodeType属性:nodeType属性是只读的。
(元素:1;属性:2;文本:3;注释:8;文档:9)
注意:removeChild()方法必须要引用父元素。
格式:parent.removeChild(child);
或 chlid.parentNode.removeChild(child);
HTML DOM 导航:
getElementsByTagName() 方法返回节点列表。节点列表是一个节点数组。下标从0开始。
用length返回数组的长度。
这里有两个特殊的属性,可以访问全部文档:
document.documentElement - 全部文档
document.body - 文档的主体
除了 innerHTML 属性,您也可以使用 childNodes 和 nodeValue 属性来获取元素的内容。