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 相关文章推荐
用tip解决Ext列宽度不够的问题
Dec 13 Javascript
Google 静态地图API实现代码
Nov 19 Javascript
jquery监控数据是否变化(修正版)
Apr 12 Javascript
jQuery中hide()方法用法实例
Dec 24 Javascript
js实现图片从左往右渐变切换效果的方法
Feb 06 Javascript
JS实现按比例缩放图片的方法(附C#版代码)
Dec 08 Javascript
详解js中==与===的区别
Jan 08 Javascript
JS实现css hover操作的方法示例
Apr 07 Javascript
Swiper自定义分页器使用详解
Dec 28 Javascript
vue-cli启动本地服务局域网不能访问的原因分析
Jan 22 Javascript
微信小程序3种位置API的使用方法详解
Aug 05 Javascript
解决vue项目刷新后,导航菜单高亮显示的位置不对问题
Nov 01 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
PHILIPS L4X25T电路分析和打理
2021/03/02 无线电
PHP中error_reporting()函数的用法(修改PHP屏蔽错误)
2011/07/01 PHP
使用PHPMailer实现邮件发送代码分享
2014/10/23 PHP
深入剖析PHP中printf()函数格式化使用
2016/05/23 PHP
php简单计算年龄的方法(周岁与虚岁)
2016/12/06 PHP
php+ajax实现无刷新文件上传功能(ajaxuploadfile)
2018/02/11 PHP
PHP中quotemeta()函数的用法讲解
2019/04/04 PHP
Javascript 颜色渐变效果的实现代码
2013/10/01 Javascript
深入理解JavaScript是如何实现继承的
2013/12/12 Javascript
为JS扩展Array.prototype.indexOf引发的问题及解决办法
2015/01/21 Javascript
JS实现控制表格只显示行边框或者只显示列边框的方法
2015/03/31 Javascript
SpringMVC返回json数据的三种方式
2015/12/10 Javascript
第四篇Bootstrap网格系统偏移列和嵌套列
2016/06/21 Javascript
关于JS变量和作用域详解
2016/07/28 Javascript
BOM系列第三篇之定时器应用(时钟、倒计时、秒表和闹钟)
2016/08/17 Javascript
D3.js实现折线图的方法详解
2016/09/21 Javascript
巧用Vue.js+Vuex制作专门收藏微信公众号的app
2016/11/03 Javascript
jquery实现轮播图效果
2017/02/13 Javascript
BootStrap Table 后台数据绑定、特殊列处理、排序功能
2017/05/27 Javascript
jquery在vue脚手架中的使用方式示例
2017/08/29 jQuery
vue 表单验证按钮事件交由父组件触发的方法
2018/12/17 Javascript
Python的一些用法分享
2012/10/07 Python
Python浅复制中对象生存周期实例分析
2018/04/02 Python
Python中GIL的使用详解
2018/10/03 Python
python解析命令行参数的三种方法详解
2019/11/29 Python
Python3连接Mysql8.0遇到的问题及处理步骤
2020/02/17 Python
Python3的socket使用方法详解
2020/02/18 Python
python属于解释语言吗
2020/06/11 Python
用HTML5实现网站在windows8中贴靠的方法
2013/04/21 HTML / CSS
外企测试工程师面试题
2015/02/01 面试题
科研先进个人典型材料
2014/01/31 职场文书
运动会通讯稿500字
2014/02/20 职场文书
中学学校门卫岗位职责
2014/08/15 职场文书
小学生纪念九一八事变演讲稿
2014/09/14 职场文书
2019年入党思想汇报
2019/03/25 职场文书
 分享一个Python 遇到数据库超好用的模块
2022/04/06 Python