javascript 拷贝节点cloneNode()使用介绍

 这篇文章主要介绍了javascript 节点操作拷贝节点cloneNode()的使用,需要的朋友可以参考下

cloneNode(a)方法接受一个布尔值参数,表示是否深拷贝 
true:表示执行深拷贝,复制本节点以及整个子节点树. 
false:浅拷贝.只复制节点本身. 
复制后返回的节点副本属于文档所有,但是并没有父节点.除非使用appendChild,insertChild(),replaceChild()将它添加到文档 
代码如下:
<div id="guoDiv"> 
<span>1</span> 
<span>2</span> 
<span>3</span> 
</div> 
var oDiv = document.getElementById("guoDiv"); 
var deepList = oDiv.cloneNode(true); //拷贝子节点 
alert(deepList.childNodes.length); //3或7(兼容性问题,所以结果不一样) 
var showList = oDiv.cloneNode(false); //只拷贝当前元素的引用 
alert(showList.childNodes.length); //0 
 
 

时间: 2024-09-11 19:24:40

javascript 拷贝节点cloneNode()使用介绍的相关文章

javascript 拷贝节点cloneNode()使用介绍_javascript技巧

cloneNode(a)方法接受一个布尔值参数,表示是否深拷贝 true:表示执行深拷贝,复制本节点以及整个子节点树. false:浅拷贝.只复制节点本身. 复制后返回的节点副本属于文档所有,但是并没有父节点.除非使用appendChild,insertChild(),replaceChild()将它添加到文档 复制代码 代码如下: <div id="guoDiv"> <span>1</span> <span>2</span>

javascript移出节点removeChild()使用介绍

 这篇文章主要介绍了javascript节点操作移出节点removeChild()的使用,需要的朋友可以参考下 removeChild(a)是用来删除文档中的已有元素  参数a:要移出的节点  代码如下: <div id="guoDiv">  <span>1</span>  <span>2</span>  <span>3</span>  </div>    var oDiv = docume

Javascript中的call()方法介绍

 这篇文章主要介绍了Javascript中的call()方法介绍,本文讲解了Call() 语法.Call() 参数.Javascript中的call()方法.Call()方法的实例等内容,需要的朋友可以参考下     在Mozilla的官网中对于call()的介绍是: 代码如下: call() 方法在使用一个指定的this值和若干个指定的参数值的前提下调用某个函数或方法. Call() 语法 代码如下: fun.call(thisArg[, arg1[, arg2[, ...]]])   Cal

关于Javascript可视化节点的插件

问题描述 关于Javascript可视化节点的插件 如图: 像这样点击某个节点向四周展开并且能够动态加载的插件有没有知道的,节点可以拖拽的,在网上找了好久都没有找到(注:不是流程图,主要是体现一种关联关系). 解决方案 找myflow这个raphael绘图的扩展,符合你的要求

javascript运算符——位运算符全面介绍_基础知识

前面的话 位运算符是非常底层的运算,由于其很不直观,所以并不常用.但是,其速度极快,且合理使用能达到很好的效果.本文将介绍javascript中常常被忽视的运算符--位运算符 二进制表示 ECMAScript中的所有数值都以IEEE-754 64位格式存储,但位操作符并不直接操作64位的值,而是以32位带符号的整数进行运算的,并且返回值也是一个32位带符号的整数 这种位数转换使得在对特殊的NaN和Infinity值应用位操作时,这两个值都会被当成0来处理 如果对非数值应用位操作符,会先使用Num

JavaScript实现节点的删除与序号重建实例_javascript技巧

本文实例讲述了JavaScript实现节点的删除与序号重建.分享给大家供大家参考.具体如下: 这里演示JavaScript节点的删除与重建方法,删除节点后,会自动重新建立节点,序号自动排列,比如删除当前的第3条数据后,第4条的序号会智能变为3,以此类推,保证序号不乱. 运行效果如下图所示: 删除前: 删除后: 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://ww

javascript面向对象入门基础详细介绍_js面向对象

什么是对象 简单点说,编程语言中的对象是对现实中事物的简化.例如,我们一个人就是一个对象,但是编程语言很难完全描述一个这样复杂的对象.所以我们必须做出简化,首先,将人简化成属性和行为的组合,然后仅仅保留对程序有意义的几个属性以及行为.例如,我们做一个统计某学校的人的身高的程序,那么我们在这个程序中就可以把人的行为省略掉,只保留行为,并且只保留身高这一个属性.这样,我们就得到了一个最简单的对象. JavaScript字符串对象 对象的属性 其实我们之前在HTML DOM中已经就是在使用对象了.例如

JavaScript中的ArrayBuffer详细介绍_javascript技巧

相信每一个 javascript 学习者,都会去了解 JS 的各种基本数据类型,数组就是数据的组合,这是一个很基本也十分简单的概念,他的内容没多少,学好它也不是件难事情.但是本文着重要介绍的并不是我们往常看到的 Array,而是 ArrayBuffer. 我写的很多东西都是因为要完成某些特定的功能而刻意总结的,可以算是备忘,本文也是如此!前段时间一直在研究 Web Audio API 以及语音通信相关的知识,内容侧重于音频流在 AudioContext 各个节点之间的流动情况,而现在要摸清楚音频

JavaScript中的异常处理方法介绍

 这篇文章主要介绍了详解JavaScript中的异常处理方法,包括基本的try...catch语句和throw语句的使用,需要的朋友可以参考下     有三种类型的编程错误:(1)语法错误和(2)运行时错误(3)逻辑错误: 语法错误: 语法错误,也被称为解析错误,在编译时进行传统的编程语言,并出现在JavaScript解释时. 例如,下面一行将导致一个语法错误,因为它缺少一个右括号: ? 1 2 3 4 5 <script type="text/javascript"> &