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 相关文章推荐
YUI的Tab切换实现代码
Apr 11 Javascript
JS判断元素为数字的奇异写法分享
Aug 01 Javascript
原生js和jquery中有关透明度设置的相关问题
Jan 08 Javascript
调整小数的格式保留小数点后两位
May 14 Javascript
jQuery带时间的日期控件代码分享
Aug 26 Javascript
js实现鼠标点击左上角滑动菜单效果代码
Sep 06 Javascript
jQuery基于扩展实现的倒计时效果
May 14 Javascript
JS实现的全排列组合算法示例
Oct 09 Javascript
微信小程序如何获取openid及用户信息
Jan 26 Javascript
MockJs结合json-server模拟后台数据
Aug 26 Javascript
浅谈vue3中effect与computed的亲密关系
Oct 10 Javascript
在js文件中引入(调用)另一个js文件的三种方法
Sep 11 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
在Windows中安装Apache2和PHP4的权威指南
2006/10/09 PHP
PHP新手用的Insert和Update语句构造类
2012/03/31 PHP
解析php时间戳与日期的转换
2013/06/06 PHP
php使用curl下载指定大小的文件实例代码
2017/09/30 PHP
jQuery中append、insertBefore、after与insertAfter的简单用法与注意事项
2020/04/04 Javascript
jQuery学习笔记 操作jQuery对象 属性处理
2012/09/19 Javascript
Jquery+CSS3实现一款简洁大气带滑动效果的弹出层
2013/05/15 Javascript
原生js的弹出层且其内的窗口居中
2014/05/14 Javascript
jQuery setTimeout传递字符串参数报错的解决方法
2014/06/09 Javascript
jQuery中innerWidth()方法用法实例
2015/01/19 Javascript
javascript正则表达式基础知识入门
2015/04/20 Javascript
js创建jsonArray传输至后台及后台全面解析
2016/04/11 Javascript
javascript实现Emrips反质数枚举的示例代码
2017/12/06 Javascript
JS基于for语句编写的九九乘法表示例
2018/01/04 Javascript
详解各版本React路由的跳转的方法
2018/05/10 Javascript
Vue使用localStorage存储数据的方法
2019/05/27 Javascript
如何解决js函数防抖、节流出现的问题
2019/06/17 Javascript
微信小程序实现拨打电话功能的示例代码
2020/06/28 Javascript
Python中使用dom模块生成XML文件示例
2015/04/05 Python
Python中IPYTHON入门实例
2015/05/11 Python
Python 生成 -1~1 之间的随机数矩阵方法
2018/08/04 Python
python自动发送测试报告邮件功能的实现
2019/01/22 Python
如何利用Python开发一个简单的猜数字游戏
2019/09/22 Python
keras得到每层的系数方式
2020/06/15 Python
编写python代码实现简单抽奖器
2020/10/20 Python
利用Python实现自动扫雷小脚本
2020/12/17 Python
css3 clip实现圆环进度条的示例代码
2018/02/07 HTML / CSS
国际奢侈品品牌童装购物网站:Designer Childrenswear
2019/05/08 全球购物
职业生涯规划设计步骤
2014/01/12 职场文书
校园奶茶店创业计划书
2014/01/23 职场文书
大学生个人自荐信样本
2014/03/02 职场文书
最美乡村医生事迹材料
2014/06/02 职场文书
小学生红领巾广播稿
2015/08/19 职场文书
2016年大学生寒假社会实践心得体会
2015/10/09 职场文书
公文写作:新员工转正申请书范本3篇!
2019/08/07 职场文书
go goroutine 怎样进行错误处理
2021/07/16 Golang