复制元素节点

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
 5 <title>jQ复制元素节点</title>
 6 <style>
 7     *{margin: 0;padding: 0;}
 8     body{padding: 100px;font-size: 12px;}
 9     #box{border: solid 1px #ccc;overflow: hidden;}
10     .small_box{width: 50px;height: 50px;background: orange;margin: 3px;float: left;}
11 </style>
12 <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.js"></script>
13 <script>
14     $(function(){
15         $(".small_box").click(function(){
16             $(this).clone(true).appendTo("#box");
17         });
18     });
19 </script>
20 </head>
21 <body>
22     <p>点击div色块</p>
23     <div id="box">
24         <div class="small_box"></div>
25     </div>
26 </body>
27 </html>

PS:clone()方法仅是复制元素本身,被复制后的新元素不具有任何元素行为。如果需要在复制时将该元素的全部行为也进行复制,可以通过clone(true)实现。

高否?富否?帅否? 否? 滚去学习!
原文地址:https://www.cnblogs.com/baixc/p/3387401.html