DOM节点深度克隆函数cloneNode()用法实例


Posted in Javascript onJanuary 12, 2015

本文实例讲述了DOM节点深度克隆函数cloneNode()用法。分享给大家供大家参考。

具体实现方法如下:

<html>

<head>

<script type="text/javascript">

function t(){ 

 var nodeul = document.getElementsByTagName('ul')[0];//获取需要复制的UL节点

 var newul = nodeul.cloneNode(true);//true表示深度复制,即边下边的li和文本也一起;如果是false,则只复制ul

 

 var node_copy = document.getElementById('copyul');

 node_copy.appendChild(newul);

}

</script>

</head>

<body>

<div id="container">

 <ul>

  <li>春天</li>

  <li>夏天</li>

  <li>秋天</li>

  <li>冬天</li>

 </ul>

</div>

<div id="copyul">

</div>

<hr />

<button onclick="t()" value="">指定位置增加节点</button>

</body>

</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
在JavaScript中使用inline函数的问题
Mar 08 Javascript
javascript查找字符串中出现最多的字符和次数的小例子
Oct 29 Javascript
JavaScript字符串对象substr方法入门实例(用于截取字符串)
Oct 16 Javascript
原生js实现类似弹窗抖动效果
Apr 02 Javascript
js实现简单鼠标跟随效果的方法
Apr 10 Javascript
JAVASCRIPT代码编写俄罗斯方块网页版
Nov 26 Javascript
使用postMesssage()实现iframe跨域页面间的信息传递
Mar 29 Javascript
AngularJS ng-bind-template 指令详解
Jul 30 Javascript
js实现扫雷小程序的示例代码
Sep 27 Javascript
使用Vue开发动态刷新Echarts组件的教程详解
Mar 22 Javascript
JavaScript 2018 中即将迎来的新功能
Sep 21 Javascript
Vue插值、表达式、分隔符、指令知识小结
Oct 12 Javascript
DOM节点删除函数removeChild()用法实例
Jan 12 #Javascript
原生javascript实现图片弹窗交互效果
Jan 12 #Javascript
原生javascript实现图片按钮切换
Jan 12 #Javascript
原生javascript实现图片滚动、延时加载功能
Jan 12 #Javascript
DOM节点的替换或修改函数replaceChild()用法实例
Jan 12 #Javascript
原生javascript实现Tab选项卡切换功能
Jan 12 #Javascript
推荐4个原生javascript常用的函数
Jan 12 #Javascript
You might like
日本十大最佳动漫,全都是二次元的神级作品
2019/10/05 日漫
php获取数组长度的方法(有实例)
2013/10/27 PHP
微信支付扫码支付php版
2016/07/22 PHP
js保留小数点后几位的写法
2014/01/03 Javascript
Javascript递归打印Document层次关系实例分析
2015/05/15 Javascript
jQuery横向擦除焦点图特效代码分享
2015/09/06 Javascript
每天一篇javascript学习小结(属性定义方法)
2015/11/19 Javascript
BootStrap glyphicons 字体图标实现方法
2016/05/01 Javascript
基于css3新属性transform及原生js实现鼠标拖动3d立方体旋转
2016/06/12 Javascript
全面了解JavaScript的数据类型转换
2016/07/01 Javascript
JavaScript 事件对内存和性能的影响
2017/01/22 Javascript
浅谈Angular HttpClient简单入门
2018/05/04 Javascript
基于Vue的延迟加载插件vue-view-lazy
2018/05/21 Javascript
vue-cli3脚手架的配置及使用教程
2018/08/28 Javascript
使用 vue 实现灭霸打响指英雄消失的效果附demo
2019/05/06 Javascript
JS数组转字符串实现方法解析
2020/09/04 Javascript
Python常用小技巧总结
2015/06/01 Python
Python判断变量是否为Json格式的字符串示例
2017/05/03 Python
Python实现字典去除重复的方法示例
2017/07/31 Python
Python+Selenium使用Page Object实现页面自动化测试
2019/07/14 Python
详解在Python中以绝对路径或者相对路径导入文件的方法
2019/08/30 Python
Python如何实现小程序 无限求和平均
2020/02/18 Python
jupyter notebook 重装教程
2020/04/16 Python
在PyCharm中安装PaddlePaddle的方法
2021/02/05 Python
Banggood官网:面向全球客户的综合商城
2017/04/19 全球购物
List, Set, Map是否继承自Collection接口?
2016/05/16 面试题
JAVA中的关键字有什么特点
2014/03/07 面试题
开会迟到检讨书
2014/01/08 职场文书
交通事故检查书范文
2014/01/30 职场文书
小学语文教学经验交流材料
2014/06/02 职场文书
法定代表人资格证明书
2014/09/11 职场文书
学校总务处领导班子民主生活会对照检查材料思想汇报
2014/09/27 职场文书
解决Nginx 配置 proxy_pass 后 返回404问题
2021/03/31 Servers
HTML基础详解(上)
2021/10/16 HTML / CSS
mysql查找连续出现n次以上的数字
2022/05/11 MySQL
Python如何利用pandas读取csv数据并绘图
2022/07/07 Python