jQuery中clone()方法用法实例_JavaScript

jQuery中clone()方法用法实例

2021-07-14 17:46jQuery教程网 JavaScript

这篇文章主要介绍了jQuery中clone()方法用法,实例分析了clone()方法的功能、定义及克隆匹配的DOM元素的使用技巧,需要的朋友可以参考下

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

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

语法结构:

复制代码代码如下:

$(selector).clone(Events，deepEvents)

参数列表:

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

实例代码:

复制代码代码如下:

	
	<!DOCTYPE html>

	<html>

	<head>

	<meta charset="utf-8">

	<meta name="author" content="http://www.zzvips.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>