JQuery clone()用法及代码示例

clone()是jQuery中的内置方法，用于复制所选元素(包括其子节点，文本和属性)。
用法:

$(selector).clone(true|false)

参数：它接受一个可选参数，该参数可以为true或false，指定是否应复制事件处理程序。
返回值：它返回所选元素的克隆元素。

jQuery代码显示此方法的用法方式：
代码1：
在下面的代码中，不会将true或false传递给change方法。

<html> 
  
<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/ 
               jquery/3.3.1/jquery.min.js"></script> 
                 
    <!--In this example no parameter is passing to the  
        clone method-->
    <script> 
        $(document).ready(function() { 
            $("button").click(function() { 
                $("p").clone().appendTo("body"); 
            }); 
        }); 
    </script> 
</head> 
  
<body> 
    <p>Welcome to</p> 
    <p>GeeksforGeeks !!!</p> 
    <!--click on this method and see the clone element-->
    <button>Click Me!</button> 
</body> 
  
</html>

在单击“Click Me”按钮之前，

单击“Click Me”按钮后，

代码2：
在下面的代码中，将true传递给clone方法。

<html> 
  
<head> 
    <script src="https://ajax.googleapis.com/ajax/libs/ 
                jquery/3.3.1/jquery.min.js"></script> 
    <!--here clone method is called with the true value passing-->
    <script> 
        $(document).ready(function() { 
            $("button").click(function() { 
                $("body").append($("p:first").clone(true)); 
            }); 
            $("p").click(function() { 
                $(this).animate({ 
                    fontSize: "+=1px" 
                }); 
            }); 
        }); 
    </script> 
</head> 
  
<body> 
    <p>GeeksforGeeks !</p> 
    <p>Hello Writer !</p> 
    <!--click on this method and see the clone element-->
    <button>Click Me!</button> 
</body> 
  
</html>

在此示例中，当您单击“GeeksforGeeks”时，代码事件处理程序animate将起作用，这也将反映在克隆的元素上。
输出：
在单击“Click Me”按钮之前，

单击“Click Me”按钮后，

相关用法

注：本文由纯净天空筛选整理自kundankumarjha大神的英文原创作品 jQuery | clone() with Examples。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。