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 THICKBOX弹出层插件
Aug 30 Javascript
Google Map API更新实现用户自定义标注坐标
Jul 29 Javascript
jquery.lazyload  实现图片延迟加载jquery插件
Feb 06 Javascript
ECMAScript6函数剩余参数(Rest Parameters)
Jun 12 Javascript
JavaScript中Null与Undefined的区别解析
Jun 30 Javascript
javascript和jQuery实现网页实时聊天的ajax长轮询
Jul 20 Javascript
vue-cli如何快速构建vue项目
Apr 26 Javascript
Vue学习笔记进阶篇之vue-router安装及使用方法
Jul 19 Javascript
Vue Cli与BootStrap结合实现表格分页功能
Aug 18 Javascript
JavaScript事件发布/订阅模式原理与用法分析
Aug 21 Javascript
JSON生成Form表单的方法示例
Nov 21 Javascript
微信小程序点击按钮动态切换input的disabled禁用/启用状态功能
Mar 07 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
WIN98下Apache1.3.14+PHP4.0.4的安装
2006/10/09 PHP
PHP简单系统查询模块代码打包下载
2008/06/07 PHP
php 生成饼图 三维饼图
2009/09/28 PHP
php+mysql查询优化简单实例
2015/01/13 PHP
Zend Framework教程之响应对象的封装Zend_Controller_Response实例详解
2016/03/07 PHP
Laravel中使用FormRequest进行表单验证方法及问题汇总
2016/06/19 PHP
PHP中串行化用法示例
2016/11/16 PHP
jQuery EasyUI API 中文文档 可调整尺寸
2011/09/29 Javascript
JavaScript通过RegExp实现客户端验证处理程序
2013/05/07 Javascript
浏览器窗口大小变化时使用resize事件对框架不起作用的解决方法
2014/05/11 Javascript
jquery插件jquery.confirm弹出确认消息
2015/12/22 Javascript
webpack4 + react 搭建多页面应用示例
2018/08/03 Javascript
AngularJS与后端php的数据交互方法
2018/08/13 Javascript
JavaScript fetch接口案例解析
2018/08/30 Javascript
layDate日期控件使用方法详解
2018/11/15 Javascript
详解vue beforeEach 死循环问题解决方法
2020/02/25 Javascript
jquery html添加元素/删除元素操作实例详解
2020/05/20 jQuery
详解JavaScript原型与原型链
2020/11/16 Javascript
[57:31]DOTA2-DPC中国联赛 正赛 SAG vs CDEC BO3 第一场 2月1日
2021/03/11 DOTA
详解Django之admin组件的使用和源码剖析
2018/05/04 Python
Python 中的lambda函数介绍
2018/10/10 Python
python调用百度地图WEB服务API获取地点对应坐标值
2019/01/16 Python
Python操作Mongodb数据库的方法小结
2019/09/10 Python
在Keras中CNN联合LSTM进行分类实例
2020/06/29 Python
临床医学应届生求职信
2013/11/06 职场文书
电子商务专员岗位职责
2013/12/11 职场文书
八年级音乐教学反思
2014/01/09 职场文书
大学生职业规划论文
2014/01/11 职场文书
企业道德讲堂实施方案
2014/03/19 职场文书
运动员口号
2014/06/09 职场文书
中层干部培训方案
2014/06/16 职场文书
厉行节约工作总结
2015/08/12 职场文书
浅谈Python项目的服务器部署
2021/04/25 Python
Spring mvc是如何实现与数据库的前后端的连接操作的?
2021/06/30 Java/Android
JavaScript分页组件使用方法详解
2021/07/26 Javascript
JavaScript组合继承详解
2021/11/07 Javascript