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深入理解js闭包
Jul 03 Javascript
javascript firefox 自动加载iframe 自动调整高宽示例
Aug 27 Javascript
jCallout 轻松实现气泡提示功能
Sep 22 Javascript
js实现搜索框关键字智能匹配代码
Mar 26 Javascript
基于JavaScript实现瀑布流效果(循环渐近)
Jan 27 Javascript
websocket+node.js实现实时聊天系统问题咨询
May 17 Javascript
jQuery图片缩放插件smartZoom使用实例详解
Aug 25 jQuery
react实现换肤功能的示例代码
Aug 14 Javascript
ES6小技巧之代替lodash
Jun 07 Javascript
微信小程序转化为uni-app项目的方法示例
May 22 Javascript
vue实现登录拦截
Jun 29 Javascript
查找Vue中下标的操作(some和findindex)
Aug 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
php视频拍照上传头像功能实现代码分享
2015/10/08 PHP
PHP+Mysql分布式事务与解决方案深入理解
2021/02/27 PHP
非常不错的一个javascript 类
2006/11/07 Javascript
使用jQuery简化Ajax开发 Ajax开发入门
2009/10/14 Javascript
jQuery 处理表单元素的代码
2010/02/15 Javascript
javascript中的作用域scope介绍
2010/12/28 Javascript
js静态方法与实例方法分析
2011/07/04 Javascript
Javascript学习笔记 delete运算符
2011/09/13 Javascript
jquery ajax请求实例深入解析
2012/11/26 Javascript
实例说明为什么不要行内使用javascript
2014/04/18 Javascript
一个JavaScript防止表单重复提交的实例
2014/10/21 Javascript
封装好的js判断操作系统与浏览器代码分享
2015/01/09 Javascript
5个数组Array方法: indexOf、filter、forEach、map、reduce使用实例
2015/01/29 Javascript
探究Vue.js 2.0新增的虚拟DOM
2016/10/20 Javascript
JavaScript仿百度图片浏览效果
2016/11/23 Javascript
怎样判断jQuery当前元素是隐藏还是显示
2016/11/23 Javascript
JS实现touch 点击滑动轮播实例代码
2017/01/19 Javascript
JS排序之快速排序详解
2017/04/08 Javascript
jQuery导航条固定定位效果实例代码
2017/05/26 jQuery
JavaScript通过mouseover()实现图片变大效果的示例
2017/12/20 Javascript
浅析Proxy可以优化vue的数据监听机制问题及实现思路
2018/11/29 Javascript
在layui中select更改后生效的方法
2019/09/05 Javascript
es6函数之尾调用优化实例分析
2020/04/25 Javascript
vue-cli或vue项目利用HBuilder打包成移动端app操作
2020/07/29 Javascript
[00:36]TI7不朽珍藏III——斯温不朽展示
2017/07/15 DOTA
简单的连接MySQL与Python的Bottle框架的方法
2015/04/30 Python
对Python 简单串口收发GUI界面的实例详解
2019/06/12 Python
python 缺失值处理的方法(Imputation)
2019/07/02 Python
基于python修改srt字幕的时间轴
2020/02/03 Python
Pytorch 高效使用GPU的操作
2020/06/27 Python
Python是怎样处理json模块的
2020/07/16 Python
如何在Canvas上的图形/图像绑定事件监听的实现
2020/09/16 HTML / CSS
美国最大的农村生活方式零售店:Tractor Supply Company(TSC)
2017/05/15 全球购物
关于拾金不昧的感谢信
2015/01/21 职场文书
信访工作个人总结
2015/03/03 职场文书
关于感恩的歌曲整理(8首)
2019/08/14 职场文书