当前位置:首页 > 开发 > Web前端 > DOM > 正文

javaScript DOM方法与属性摘要

发表于: 2012-04-07   作者:czpae86   来源:转载   浏览次数:
摘要: 1 createElement(element)  创建一个指定标签名创建一个新的元素节点,返回值为指向新建元素节点的引用指针。  eg) var para = document.createElement("p");      document.body.appendChild(para);   2

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 返回给定节点的上一个子节点

javaScript DOM方法与属性摘要

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

编辑推荐
getElementsByName()方法 返回带有指定名称的节点对象的集合。 语法: document.getElementsByName(
jQuery操纵DOM元素属性 attr()和removeAtrr()方法使用详解   jQuery中操纵元素属性的方法:    a
提纲 一、简介 二、应用举例 三、思想 四、实现 五、html-Dom树特征 一、简介 基于Dom树的抽取技术
jQuery操纵DOM元素属性 attr()和removeAtrr()方法使用详解   jQuery中操纵元素属性的方法:   at
原文: jQuery操纵DOM元素属性 attr()和removeAtrr()方法使用详解 jQuery操纵DOM元素属性 attr()和rem
一、Node DOM模型定义了Node接口,在DOM中的每个节点都是一个Node(即实现了Node接口),每个Node都
javascript操作DOM w3c把文档表示为树。我们先从dom的继承来说起: 当浏览器解析完文档后,每个节点
<iframe align="center" marginwidth="0" marginheight="0" src="http://www.zealware.com/csdnbl
文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法。DOM 将HTML文档呈现
JavaScript DOM基本操作 JavaScript DOM的基本操作主要分为四种: 获取节点 节点操作 属性操作 文本
版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号