jq中复制节点clone方法的介绍与用法
墨初 Web前端 627阅读
Jquery中复制一个元素包括这个元素内的所有子孙元素可以使用 clone() 方法，下面就针对这个方法做个介绍以及方法如何去使用。
JQuery clone() 方法
clone()：复制一个指定的元素，包括这个元素所有的子节点，内容以及元素的各种属性等等。
语法：
$(selector).clone();
jq复制指定的元素的方法
例1：利用clone() 方法复制一个元素
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>73so.com-复制DIV元素的内容</title>
<script src="https://cdn.staticfile.org/jquery/2.2.4/jquery.min.js"></script>
</head>
<body>
<div id="mochu">我是可以被复制的</div>
<button id="but">点击复制</button>
<script>
$('#but').on('click',function(){
console.log($('#mochu').clone());
});
</script>
</body>
</html>例2：jq方法复制元素到指定的元素中
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>73so-复制DIV元素的内容</title>
<script src="https://cdn.staticfile.org/jquery/2.2.4/jquery.min.js"></script>
</head>
<body>
<div id="mochu">我是可以被复制的</div>
<button id="but">点击复制</button>
<div id="to"></div>
<script>
//将ID为mochu的整个元素包括内容，复制到id为to的元素中去
$('#but').on('click',function(){
$('#to').html($('#mochu').clone());
});
</script>
</body>
</html>