`

常用DOM方法实例

阅读更多
1 createElement(element)
创建一个指定标签名创建一个新的元素节点,返回值为指向新建元素节点的引用指针。
eg) var para = document.createElement("p");
document.body.appendChild(para);

2 createTextNode()
创建一个包含着给定文本的新文本节点,返回一个指向新建文本节点的引用指针:
reference = document.createTextNode()
参数为新建文本节点所包含的文本字符串
eg)
var message = document.createTextNode("hello world");
var container = document.createElement("p");
container.appendChild(message);
document.body.appendChild(container);

3 cloneNode()
reference = node.cloneNode(deep)
为给定节点创建一个副本,参数为true或者false,true表示同时复制该节点的子节点,false则不复制任何子节点。
var para = document.createElement("p");
var message = document.createTextNode("hello world");
para.appendChild(message);
document.body.appendChild(para);
var newpara = para.cloneNode(true);
document.body.appendChild(newpara);

4 appendChild()
reference = node.appendChild(newChild);
插入节点,例子参考前面。

5 insertBefore()
reference = element.insertBefore(newNode,targetNode)
将一个给定节点插入到一个给定元素节点的给定子节点的前面,返回一个指向新增子节点的引用指针。
eg)
var container = document.getElementById("content");
var message = document.getElementById("fineprint");
var para = document.createElement("p");
container.insertBefore(para,message);

6 removeChild()
reference = element.removeChild(node)
将从一个给定元素利删除一个子节点,返回一个指向已被删除的子节点的引用指针。
当某个节点被removeChild()删除后,此节点所有子节点都被删除。

7 replaceChild()
reference = element.replaceChild(newChild,oldChild)
把一个给定父元素里的一个子节点替换为另外一个节点,oldChild节点必须是element元素的一个子节点,返回值是一个指向已被替换的那个
子节点的引用指针。
eg)
var container = document.getElementById("content");
var message = document.getElementById("fineprint");
var para = document.createElement("p");
container.replaceChild(para,message);

8 setAttribute()
element.setAttribute(attributeName,attributeValue);
为给定元素节点添加一个新的属性值或是改变它的现有属性

9 getAttribute
attributeValue = element.getAttribute(attributeName)
返回一个给定元素的一个给定属性节点的值。

10 getElementById()
element = document.getElementById(ID)
寻找一个有着给定id属性值的元素,返回一个元素节点

11 getElementByTagName()
用于寻找有着给定标签名的所有元素:
elements = document.getElementsByTagName(tagName)
返回一个节点集合。

12 hasChildNodes
用来检查一个给定元素是否有子节点
booleanValue = element.hasChildNodes
返回true或false。

13 DOM属性
节点的属性
nodeName属性将返回一个字符串,其内容是给定节点的名字。
如果节点是元素节点,返回这个元素的名称;
如果是属性节点,返回这个属性的名称;
如果是文本节点,返回一个内容为#text的字符串;

nodeType属性将返回一个整数,这个数值代表给定节点的类型
nodeValue属性将返回给定节点的当前值
如果节点是元素节点,返回null;
如果是属性节点,返回这个属性的名称;
如果是文本节点,返回文本节点的内容;

遍历节点树
childNodes 该属性返回一个数组,这个数组由给定元素节点的子节点构成
firstChild 返回第一个子节点
lastChild 返回最后一个子节点
nextSibling 返回给定节点的下一个子节点
parentNode 返回一个给定节点的父节点
previousSibling 返回给定节点的下一个子节点??
分享到:
评论

相关推荐

    .net平台DOM解析实例

    在.NET平台上,DOM(Document Object Model)解析是一种处理XML文档常用的方法。DOM提供了一种结构化的表示XML数据的方式,允许开发者通过对象模型来访问和操作XML文档的各个部分。本实例将深入探讨.NET中的DOM解析...

    dom4j常用操作实例

    此文档包含了Dom4J常用的操作(对于一般的应用足够了)和实例,可模仿开发

    javascript常用方法实例

    在这个“javascript常用方法实例”中,我们将会探讨一些JavaScript的核心概念和常用方法,以及它们在实际应用场景中的实例。 1. **DOM操作**:Document Object Model(DOM)是HTML和XML文档的结构化表示,...

    DOM解析xml文件实例讲解

    总的来说,DOM解析XML在Android中是一种常用且灵活的方法,尤其适合处理小型XML文件。但要注意根据项目需求选择合适的解析策略,确保性能和资源的合理利用。在实际编码过程中,结合具体的业务场景和XML文件大小,...

    常用手册 DOM文档对象模型.chm

    9. **实际应用**:通过实例展示DOM在网页动态更新、AJAX异步通信、数据绑定等实际场景中的应用。 10. **与其他技术的结合**:讨论DOM与JavaScript、jQuery、XMLHttpRequest等技术的协同工作方式。 通过阅读《常用...

    dom,dom4j,sax 解析xml文件实例

    本文将深入探讨DOM、DOM4J和SAX三种常用的XML解析方法,并结合具体的实例进行详细讲解。 首先,DOM(Document Object Model)是W3C组织推荐的一种XML解析标准。它将整个XML文档加载到内存中,构建一个树形结构,...

    java dom 解析 xml 实例

    Java DOM 解析 XML 实例是 Java 语言中常用的 XML 解析方法之一,使用 W3C 推荐的文档对象模型(Document Object Model,DOM)来解析 XML 文档。DOM 提供了一个树形结构的对象模型,通过遍历树形结构可以访问和操作 ...

    经典XML处理实例采用DOM处理模式

    在XML文件读写中,DOM处理模式是一个常用的技术。它的工作原理是首先加载整个XML文件到内存,形成一个DOM树,然后通过遍历这棵树来查找、修改或添加数据。这种方式的好处在于能够方便地访问和修改任意位置的数据,但...

    XMLDOM对象方法手册.rar

    5. **Navigator对象和ActiveXObject**:在IE浏览器中,通常通过`ActiveXObject`创建XMLDOM实例,如`var xmlDom = new ActiveXObject("Microsoft.XMLDOM");`。Navigator对象则提供了关于浏览器的信息,但与XMLDOM的...

    原生JS实现几个常用DOM操作API实例

    以下将详细介绍如何使用原生JavaScript来实现一些常用的DOM操作API实例。 首先,要介绍的是如何获取元素的兄弟节点。在文档对象模型(DOM)中,每一个节点都有可能有前一个(previousSibling)和后一个...

    jQuery中DOM常见操作实例小结

    以上总结的知识点涵盖了jQuery中DOM操作的基本方法和技巧,通过实例演示了如何使用这些方法来完成具体的DOM操作任务。这些操作对于进行Web前端开发的人员来说至关重要,因为它们可以帮助开发者高效地对网页内容进行...

    Java解析XML文档(DOM与DOM4j两种方式)

    Java提供了多种解析XML的API,其中DOM(Document Object Model)和DOM4j是常用的两种方法。本文将详细介绍这两种方式以及如何使用它们进行XML文档的增、删、改查操作。 一、DOM解析 DOM解析器将整个XML文档加载到...

    dom4J解析XML及dom4jar包

    最常用的方法是通过`DocumentBuilder`来创建一个`Document`对象,这个对象代表了整个XML文档。例如,我们可以使用以下代码来加载XML文件: ```java DocumentFactory factory = DocumentFactory.getInstance(); ...

    dom4j使用教程+dom4j.jar

    这篇教程将深入探讨DOM4J的基本概念和常用操作,帮助开发者掌握其核心功能。 ### 一、DOM4J解析XML 1. **文档对象模型(Document Object Model)**: DOM4J通过Document类代表整个XML文档,它可以被视为XML文档的根...

    js基础之DOM中document对象的常用属性方法详解

    这是一个非常常用的DOM操作方法,通过元素的id可以非常快速地定位到这个元素。 14. document.getElementsByName()方法:此方法返回带有指定名称的对象集合。虽然在HTML5标准中不再推荐使用name属性,但在某些情况下...

    android Dom解析xml文件

    DOM(Document Object Model)解析是处理XML文件的一种常用方法。DOM解析器将整个XML文档加载到内存中,形成一个树形结构,允许开发者通过节点操作来访问和修改XML内容。本篇文章将深入探讨Android中的DOM解析XML...

    java 操作XML 采用(dom+dom4j)读写源码 lib包

    在Java中,处理XML有多种方式,其中DOM(Document Object Model)和DOM4J是两种常用的方法。下面将详细介绍这两种方法以及如何在Java中使用它们来读写XML。 1. DOM解析器: DOM是一种基于树型结构的XML文档模型,它...

    dom4j文件很好

    1. **解析XML文件**:使用`DocumentFactory`创建`SAXReader`实例,然后调用`read()`方法读取XML文件到`Document`对象。 2. **遍历XML树**:通过`Element`的`elementIterator()`方法,可以迭代遍历所有子元素;`...

    java_dom解析xml xml java

    首先通过`DocumentBuilderFactory`获取`DocumentBuilder`实例,然后通过该实例的`parse`方法加载指定路径下的XML文件。 4. **获取XML文档的根节点** ```java Element root = doc.getDocumentElement(); ``` `...

    DOM4J解析XML代码

    #### DOM4J常用对象 - **SAXReader**: 用于读取XML文件,并将其转换成Document对象。 - **Document**: XML文档对象树,类似于HTML文档对象。 - **Element**: 元素节点,是构成Document的主要部分,可以用来获取XML...

Global site tag (gtag.js) - Google Analytics