DHTML DOM

最新推荐文章于 2020-08-21 16:53:14 发布

weixin_30699465

最新推荐文章于 2020-08-21 16:53:14 发布

阅读量70

点赞数

原文链接：http://www.cnblogs.com/jiangchao/archive/2008/10/11/1308583.html

版权

Dom是区分大小写的, 对元素的读取也是区分大小写的

使用 data 、nodeValue 和src 属性
DOM 提供了 2个属性用于修改文本节点的内容，它们是 data 和nodeVaule 。2 个属性实现的功能相同，语法是：object.data="new value" 或者object.nodeVaule="new value" ，其中object 代表页面中的文本项节点。如果修改图形文件的内容，语法是：object.src="new value" ，其中object 表示页面中的img 标记节点。

使用 createElement 方法
createElement 方法的功能是在文档中创建一个孤立 HTML 标记节点。孤立节点既没有孩子节点也没有双亲节点，而且与文档中的现存节点也互不关联。被创建的孤立HTML 标记节点的唯一信息就是它代表的HTML 标记，比如< P> 、< FONT> 和< TABLE> 。CreateElement 的语法为document.createElement(HTMLTag) ，HTMLTag 表示要创建的HTML 标记，返回值是创建的孤立HTML 标记节点。

使用 cloneNode 方法
cloneNode 方法的功能是通过克隆（也就是复制）文档中一个现存节点的方式创建文档的一个孤立节点。根据被克隆节点的类型，新创建的孤立节点或者是 HTML 标记节点，或者是包含字符串信息的文本项节点。cloneNode 的语法为oldNode.createNode(false) 或者oldNode.createNode(true) ，oldNode 表示被克隆的节点，返回值是新创建的节点，false 表示仅仅克隆oldNode ，true 表示克隆oldNode 并包含其下属节点

使用 appendChild 方法
appendChild 方法的功能是在 2 个节点间建立起父子关系，如果作为父亲的节点已经具有了孩子节点，那么新添加的孩子节点被追加为最后一个孩子，也就是lastChild 。appendChild 的语法是fatherObj.appendChild(childObj) ，返回值是被追加的孩子节点

使用 applyElement 方法
applyElement 方法的功能是将一个节点与它的孩子节点和父亲节点脱离，然后将另外一个节点连接到这个节点，最终使它们成为父子关系。 applyElement 的语法是childObj.applyElement(fatherObj) ，返回值是被连接的孩子节点。

applyElement 和appendChild 实现的目的基本相同，都是在2 个节点间建立父子关系，但有2 个区别：
1 、 applyElement方法只能操纵 HTML 标记节点，不能处理文本项节点。appendNode 则能处理2 种节点。
2 、 appendNode对 2 个节点的连接方式是从父到子，applyElement 则是从子到父。

使用 insertBefore 方法
insertBefore 方法的功能和 appendChild 相似，都是将一个孩子节点连接到一个父亲节点，但insertBefore 方法允许我们指定孩子节点的位置。insertBefore 的语法是fatherObj.insertBefore(childObj, brotherObj) ，返回值是被连接的孩子节点。执行后，childObj 的位置在brotherObj 之前。

使用 removeNode 方法
removeNode 方法的功能是删除一个节点，语法为 node.removeNode （false ）或者node.removeNode （true ），返回值是被删除的节点。removeNode （false ）表示仅仅删除指定节点，然后这个节点的原孩子节点提升为原双亲节点的孩子节点。removeNode （true ）表示删除指定节点及其所有下属节点。被删除的节点成为了孤立节点，不再具有有孩子节点和双亲节点。