jQuery中clone()方法用法实例


Posted in Javascript onJanuary 16, 2015

本文实例讲述了jQuery中clone()方法用法。分享给大家供大家参考。具体分析如下:

此方法克隆匹配的DOM元素并且选中这些克隆的副本以及其所有的事件处理。

语法结构:

$(selector).clone(Events,deepEvents)

参数列表:

参数 描述
Events 可选。布尔值,用来规定事件处理函数是否被复制。默认为false。 true-复制元素的所有事件处理。 false-不复制元素的事件处理。
deepEvents 可选。布尔值,用来规定是否对事件处理程序和克隆的元素的所有子元素的数据应该被复制。

实例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta name="author" content="https://3water.com/" />

<title>三水点靠木</title>

<style type="text/css">

div{

  width:200px;

  height:200px;

  border:1px solid blue;

}

p{

  width:200px;

  height:200px;

  border:1px solid green;

}

</style>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript">  

$(document).ready(function(){ 

  $("button").click(function(){ 

    $("p").clone().insertBefore("div"); 

  }) 

}) 

</script>

</head>

<body>

<div>我是div</div>

<p>我会被克隆</p>

<button>点击查看效果</button>

</body>

</html>

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

本文转自:蚂蚁部落http://www.softwhy.com/

Javascript 相关文章推荐
关于jquery性能最佳实践的讨论,与求教
Mar 30 Javascript
js简单实现删除记录时的提示效果
Dec 05 Javascript
js跳转页面方法实现汇总
Feb 11 Javascript
js实现点击按钮后给Div图层设置随机背景颜色的方法
May 06 Javascript
JS弹出对话框实现方法(三种方式)
Dec 18 Javascript
Bootstrap每天必学之工具提示(Tooltip)插件
Apr 26 Javascript
简单实现js页面切换功能
Jan 10 Javascript
jQuery EasyUI Layout实现tabs标签的实例
Sep 26 jQuery
vue 使用ref 让父组件调用子组件的方法
Feb 08 Javascript
微信小程序中时间戳和日期的相互转换问题
Jul 09 Javascript
分享vue里swiper的一些坑
Aug 30 Javascript
详解javascript中的Error对象
Apr 25 Javascript
jQuery中empty()方法用法实例
Jan 16 #Javascript
jQuery中replaceAll()方法用法实例
Jan 16 #Javascript
jQuery中wrapInner()方法用法实例
Jan 16 #Javascript
jQuery中wrapAll()方法用法实例
Jan 16 #Javascript
jQuery中unwrap()方法用法实例
Jan 16 #Javascript
jquery搜索框效果实现方法
Jan 16 #Javascript
js表头排序实现方法
Jan 16 #Javascript
You might like
一些常用的php函数
2006/12/06 PHP
php 问卷调查结果统计
2015/10/08 PHP
php中输出json对象的值(实现方法)
2018/03/07 PHP
Yii框架学习笔记之session与cookie简单操作示例
2019/04/30 PHP
6个常见的 PHP 安全性攻击实例和阻止方法
2020/12/16 PHP
漂亮的widgets,支持换肤和后期开发新皮肤(2007-4-27已更新1.7alpha)
2007/04/27 Javascript
Javascript 代码也可以变得优美的实现方法
2009/06/22 Javascript
jquery tab标签页的制作
2010/05/10 Javascript
JavaScript新窗口与子窗口传值详解
2014/02/11 Javascript
jquery+html5制作超酷的圆盘时钟表
2015/04/14 Javascript
AngularJS实现单独作用域内的数据操作
2016/09/05 Javascript
angularJs关于指令的一些冷门属性详解
2016/10/24 Javascript
React组件的三种写法总结
2017/01/12 Javascript
jQuery使用siblings获取某元素所有同辈(兄弟姐妹)元素用法示例
2017/01/30 Javascript
MUI 解决动态列表页图片懒加载再次加载不成功的bug问题
2017/04/13 Javascript
jQuery条件分页 代替离线查询(附代码)
2017/08/17 jQuery
webpack构建react多页面应用详解
2017/09/15 Javascript
微信小程序中转义字符的处理方法
2019/03/28 Javascript
轻松学习JavaScript函数中的 Rest 参数
2019/05/30 Javascript
Element DateTimePicker日期时间选择器的使用示例
2020/07/27 Javascript
vue中渲染对象中属性时显示未定义的解决
2020/07/31 Javascript
[00:19]CN DOTA NEVER DIE!VG夺冠rOtK接受采访
2019/12/23 DOTA
Python和php通信乱码问题解决方法
2014/04/15 Python
django小技巧之html模板中调用对象属性或对象的方法
2018/11/30 Python
详解django2中关于时间处理策略
2019/03/06 Python
Django项目主urls导入应用中views的红线问题解决
2019/08/10 Python
tensorflow从ckpt和从.pb文件读取变量的值方式
2020/05/26 Python
Css3实现无缝滚动防抖
2020/09/14 HTML / CSS
使用HTML5 Canvas API绘制弧线的教程
2016/03/22 HTML / CSS
Manduka官网:瑜伽垫、瑜伽毛巾和服装
2018/07/02 全球购物
澳大利亚购买健身器材网站:Gym Direct
2019/12/19 全球购物
股权转让意向书
2014/04/01 职场文书
不要在HTML中滥用div
2021/05/08 HTML / CSS
手把手教你用SpringBoot将文件打包成zip存放或导出
2021/06/11 Java/Android
美元符号 $
2022/02/17 杂记
js作用域及作用域链工作引擎
2022/07/07 Javascript