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 相关文章推荐
JS滚轮事件onmousewheel使用介绍
Nov 01 Javascript
jquery easyui datagrid实现增加,修改,删除方法总结
May 25 Javascript
javascript insertAfter()定义与用法示例
Jul 25 Javascript
给easyui的datebox控件添加清空按钮的实现方法
Nov 09 Javascript
使用snowfall.jquery.js实现爱心满屏飞的效果
Jan 05 Javascript
微信小程序 swiper组件构建轮播图的实例
Sep 20 Javascript
Node.js 中使用 async 函数的方法
Nov 20 Javascript
详解react关于事件绑定this的四种方式
Mar 09 Javascript
解决vue页面DOM操作不生效的问题
Mar 17 Javascript
react中使用css的7中方式(最全总结)
Feb 11 Javascript
JS实现点击生成UUID的方法完整实例【基于jQuery】
Jun 12 jQuery
使用vuex较为优雅的实现一个购物车功能的示例代码
Dec 09 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文件操作的详细诠释
2013/06/21 PHP
php-fpm配置详解
2014/02/12 PHP
自己写了一个php检测文件编码的函数
2014/04/21 PHP
一个简单的PHP验证码实现代码
2014/05/10 PHP
PHP资源管理框架Assetic简介
2014/06/12 PHP
一段多浏览器的&quot;复制到剪贴板&quot;javascript代码
2007/03/27 Javascript
javascript 显示当前系统时间代码
2009/12/28 Javascript
document.write()及其输出内容的样式、位置控制
2013/08/12 Javascript
jquery实现导航固定顶部的效果仿蘑菇街
2014/10/22 Javascript
jQuery控制DIV层实现由大到小,由远及近动画变化效果
2015/10/09 Javascript
jquery 重写 ajax提交并判断权限后 使用load方法报错解决方法
2016/01/19 Javascript
用JS写的一个Ajax库(实例代码)
2016/08/06 Javascript
JS关闭窗口时产生的事件及用法示例
2016/08/20 Javascript
JQ选择器_选择同类元素的第N个子元素的实现方法
2016/09/08 Javascript
利用JavaScript在网页实现八数码启发式A*算法动画效果
2017/04/16 Javascript
JS中把函数作为另一函数的参数传递方法(总结)
2017/06/28 Javascript
JavaScript 中的 this 简单规则
2017/09/19 Javascript
puppeteer库入门初探
2019/01/09 Javascript
简述pm2常用命令集合及配置文件说明
2019/05/30 Javascript
原生js+ajax分页组件
2020/01/30 Javascript
JavaScript设计模式之策略模式实现原理详解
2020/05/29 Javascript
浅谈vue单页面中有多个echarts图表时的公用代码写法
2020/07/19 Javascript
浅析 Vue 3.0 的组装式 API(一)
2020/08/31 Javascript
nodejs使用Sequelize框架操作数据库的实现
2020/10/21 NodeJs
[05:09]第二届DOTA2亚洲邀请赛决赛日比赛集锦:iG 3:0 OG夺冠
2017/04/05 DOTA
Python中获取网页状态码的两个方法
2014/11/03 Python
python 通过邮件控制实现远程控制电脑操作
2020/03/16 Python
利用Python自动化操作AutoCAD的实现
2020/04/01 Python
一款纯css3制作的2015年元旦雪人动画特效教程
2014/12/29 HTML / CSS
《三峡》教学反思
2014/03/01 职场文书
学习党的群众路线对照检查材料
2014/09/29 职场文书
老公给老婆的检讨书(精华篇)
2014/10/18 职场文书
教师节座谈会主持词
2015/07/03 职场文书
2016年妇联“6﹒26国际禁毒日”宣传活动总结
2016/04/05 职场文书
MySQL 不等于的三种使用及区别
2021/06/03 MySQL
springboot读取resources下文件的方式详解
2022/06/21 Java/Android