JQuery中clone方法复制节点


Posted in Javascript onMay 18, 2015

本文实例讲述了JQuery中clone方法复制节点。分享给大家供大家参考。具体如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>复制节点</title>
<style type="text/css">
#main{
width:300px;
margin:200px auto;
background-color:gold;
padding:10px;
}
</style>
<script src="js/jquery-1.5.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
 $(function () {
  var $text = $("#txt1");
  $text.click(function () { alert('我是文本框单击事件'); });
  $("#btn1").click(function () {
  $("#btn1").after($text.clone()); //浅克隆(不复制事件)
  });
  $("#btn2").click(function () {
  $("#btn2").after($text.clone(true)); //深克隆(复制事件)
  });
 });
</script>
</head>
<body>
 <div id="main">
 <input type="text" value="我是文本框" id="txt1" />
 <input type="button" id="btn1" value="进行浅克隆(不复制事件)" />
 <input type="button" id="btn2" value="进行深克隆(复制事件)" />
 </div>
</body>
</html>

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

Javascript 相关文章推荐
escape函数解决js中ajax传递中文出现乱码问题
Oct 30 Javascript
JS函数定义方式的区别介绍
Mar 22 Javascript
jQuery插件FusionCharts绘制的3D环饼图效果示例【附demo源码】
Apr 02 jQuery
ReactNative踩坑之配置调试端口的解决方法
Jul 28 Javascript
Bootstrap 模态框(Modal)带参数传值实例
Aug 20 Javascript
Vue2.0用户权限控制解决方案
Nov 29 Javascript
详解VUE里子组件如何获取父组件动态变化的值
Dec 26 Javascript
JS求1到任意数之间的所有质数的方法详解
May 20 Javascript
解决layer.confirm快速点击会重复触发事件的问题
Sep 23 Javascript
微信JSSDK实现打开摄像头拍照再将相片保存到服务器
Nov 15 Javascript
js消除图片小游戏代码
Dec 11 Javascript
Vue中computed及watch区别实例解析
Aug 01 Javascript
分享十五款 jQuery 社交网络分享插件
May 16 #Javascript
JS+CSS实现仿触屏手机拨号盘界面及功能模拟完整实例
May 16 #Javascript
js实现精美的图片跟随鼠标效果实例
May 16 #Javascript
js实现精美的银灰色竖排折叠菜单
May 16 #Javascript
JavaScript实现鼠标滑过处生成气泡的方法
May 16 #Javascript
JavaScript中继承用法实例分析
May 16 #Javascript
jQuery实现不断闪烁文字的方法
May 15 #Javascript
You might like
《OVERLORD》第四季,终于等到你!
2020/03/02 日漫
关于我转生变成史莱姆这档事:第二季PV上线,萌王2021年回归
2020/05/06 日漫
通过具体程序来理解PHP里面的抽象类
2010/01/28 PHP
在MongoDB中模拟Auto Increment的php代码
2011/03/06 PHP
php判断是否为json格式的方法
2014/03/04 PHP
Javascript 对象的解释
2008/11/24 Javascript
JavaScript XML操作 封装类
2009/07/01 Javascript
读jQuery之二(两种扩展)
2011/06/11 Javascript
artDialog双击会关闭对话框的修改过程分享
2013/08/05 Javascript
JQuery下拉框应用示例介绍
2014/04/23 Javascript
js实现鼠标滑过文字链接色彩变化的效果
2015/05/06 Javascript
详解 javascript中offsetleft属性的用法
2015/11/11 Javascript
简单实现JS对dom操作封装
2015/12/02 Javascript
基于AngularJS+HTML+Groovy实现登录功能
2016/02/17 Javascript
基于JavaScript实现快速转换文本语言(繁体中文和简体中文)
2016/03/07 Javascript
node模块机制与异步处理详解
2016/03/13 Javascript
快速掌握Node.js之Window下配置NodeJs环境
2016/03/21 NodeJs
javascript制作照片墙及制作过程中出现的问题
2016/04/04 Javascript
自带气泡提示的vue校验插件(vue-verify-pop)
2017/04/07 Javascript
jQuery日期范围选择器附源码下载
2017/05/23 jQuery
微信小程序 input输入及动态设置按钮的实现
2017/10/27 Javascript
JavaScript ES6中的简写语法总结与使用技巧
2018/12/30 Javascript
详解在Node.js中发起HTTP请求的5种方法
2019/01/10 Javascript
JavaScript实现的开关灯泡点击切换特效示例
2019/07/08 Javascript
python访问纯真IP数据库的代码
2011/05/19 Python
python 找出list中最大或者最小几个数的索引方法
2018/10/30 Python
Python使用requests提交HTTP表单的方法
2018/12/26 Python
Python lxml模块的基本使用方法分析
2019/12/21 Python
python实现滑雪者小游戏
2020/02/22 Python
详解Django自定义图片和文件上传路径(upload_to)的2种方式
2020/12/01 Python
欧洲最大的品牌水上运动服装和设备在线零售商:Wuituit Outlet
2018/05/05 全球购物
英国领先的隐形眼镜在线供应商:Lenstore.co.uk
2019/11/24 全球购物
委托书模板
2014/04/04 职场文书
八年级作文之一起的走过日子
2019/09/17 职场文书
HTML5 语义化标签(移动端必备)
2021/08/23 HTML / CSS