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 使用技巧精萃(.net html
Apr 25 Javascript
原生js和jquery中有关透明度设置的相关问题
Jan 08 Javascript
jquery基础教程之数组使用详解
Mar 10 Javascript
jQuery控制TR显示隐藏的三种常用方法
Aug 21 Javascript
jQuery UI库中dialog对话框功能使用全解析
Apr 23 Javascript
JavaScript通过HTML的class来获取HTML元素的方法总结
May 24 Javascript
JS实现的模仿QQ头像资料卡显示与隐藏效果
Apr 07 Javascript
Angular2使用Angular-CLI快速搭建工程(二)
May 21 Javascript
JavaScript中的高级函数
Jan 04 Javascript
vue脚手架中配置Sass的方法
Jan 04 Javascript
react-router v4如何使用history控制路由跳转详解
Jan 09 Javascript
vue点击按钮动态创建与删除组件功能
Dec 29 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中使用ExcelFileParser处理excel获得数据(可作批量导入到数据库使用)
2010/08/21 PHP
php表单提交问题的解决方法
2011/04/12 PHP
php ucwords() 函数将字符串中每个单词的首字符转换为大写(实现代码)
2016/05/12 PHP
解决php extension 加载顺序问题
2019/08/16 PHP
PHP 裁剪图片
2021/03/09 PHP
网页javascript精华代码集
2007/01/24 Javascript
javascript 得到变量类型的函数
2010/05/19 Javascript
jQuery代码优化 选择符篇
2011/11/01 Javascript
Javascript模块化编程(三)require.js的用法及功能介绍
2013/01/17 Javascript
javascript实现控制div颜色
2015/07/07 Javascript
JS实现在状态栏显示打字效果完整实例
2015/11/02 Javascript
Listloading.js移动端上拉下拉刷新组件
2016/08/04 Javascript
详解vue2.0 transition 多个元素嵌套使用过渡
2017/06/19 Javascript
JavaScript设计模式之代理模式简单实例教程
2018/07/03 Javascript
vue中动态设置meta标签和title标签的方法
2018/07/11 Javascript
javascript的this关键字详解
2019/05/20 Javascript
ES6 十大特性简介
2020/12/09 Javascript
python 缺失值处理的方法(Imputation)
2019/07/02 Python
Python 生成一个从0到n个数字的列表4种方法小结
2019/11/28 Python
Python字节单位转换实例
2019/12/05 Python
关于sys.stdout和print的区别详解
2019/12/05 Python
基于MSELoss()与CrossEntropyLoss()的区别详解
2020/01/02 Python
tensorflow从ckpt和从.pb文件读取变量的值方式
2020/05/26 Python
python如何实现图片压缩
2020/09/11 Python
OpenCV实现机器人对物体进行移动跟随的方法实例
2020/11/09 Python
a标签下载链接的简单实现
2016/09/13 HTML / CSS
阿玛尼美妆英国官网:Giorgio Armani Beauty英国
2019/03/28 全球购物
远程网络教育毕业生自我鉴定
2014/04/14 职场文书
社区优秀志愿者先进事迹
2014/05/09 职场文书
基层党建工作宣传标语
2014/06/24 职场文书
办公室文员工作自我鉴定
2014/09/19 职场文书
第二批党的群众路线教育实践活动个人对照检查材料
2014/09/23 职场文书
幼儿园安全管理制度
2015/08/05 职场文书
幼儿园六一儿童节开幕词
2016/03/04 职场文书
幼儿园教师辞职信
2019/06/21 职场文书
python 利用 PIL 将数组值转成图片的实现
2021/04/12 Python