文档对象模型DOM

        DOM的全称是Document Object Model,也即文档对象模型.

        HTML文档各个节点被视为各种类型的Node对象。每个Node对象都有自己的属性和方法,利用这些属性和方法可以遍历整个文档树。由于HTML文档的复杂性,DOM定义了nodeType来表示节点的类型DOM树的根节点是个Document对象,该对象的documentElement属性引用表示文档根元素的Element对象(对于HTML文档,这个就是<html>标记)。

        Element节点,可以通过调用getAttribute()、setAttribute()、removeAttribute()方法来查询、设置或者删除一个Element节点的性质,比如<table>标记的border属性

firstChild                     以Node的形式返回当前节点的第一个子节点。如果没有子节点,则为null。

lastChild               以Node的形式返回当前节点的最后一个子节点。如果没有子节点,则为null。nextSibling            以Node的形式返回当前节点的兄弟下一个节点。如果没有这样的节点,则返回null。nodeName            节点的名字,Element节点则代表Element的标记名称。

innerHTML: 更轻松地操纵文档。通过innerHTML属性将HTML字符串赋值给一个元素。这里就不举例了,反正很好很强大。  虽然这个innerHTML不是标准的DOM,但是几乎所有的浏览器都支持所以我们可以放心用。通过这么种种属性,我们可以再通过下面的方法来更容易的访问或操作相应的节点。 

方法:childNodes.length: 获取子节点的数量
hasChildNodes(): 查询是否存在子节点

childNodes.item(): 获取子节点因为childNodes是列表,所有item()括号里面传入的是数组里的下标。

getElementsByTagName_r(): 返回一个NodeList数组,包含所有的标记名特性

getElementsByName(): 获取所有name属性等于指定值的元素。

getElementById(): 获取单个指定元素 (此方法是从文档树中最快找到指定元素的方法)在XHTML中,id特性是唯一的,也就是说所有元素的id的不一样的。

createElement_x(tagname):创建标记名为tagname的元素 

createTextNode(text): 创建包含文本text的文本节点 

appendChild(): 在子节点后追加元素。将给定的节点添加到某个节点的chlidNodes列表尾部

 removeChild(): 移除某个节点。传的参数也就是这个要删除的节点,然后再将这个节点作为函数的返回值返回。

replaceChild():替换某个节点。

 createAttribute(name): 用定义的名称name创建特性节点(自定义节点)

insertBefore():将新节点添加的旧节点的前面。 里面有两个参数:要添加的节点和插在哪个节点之前。  

cloneNode(): 克隆节点。这个方法中,需要注意的是:方法带一个boolean参数来指示在复制时 ↓是包含该节点的所有子节点(深度复制) or 元素本身。

false 表示仅复制元素本身     true表示深度复制。

你可能感兴趣的:(文档对象模型DOM)