這篇文章主要介紹了JQuery中clone方法復制節點,實例分析了clone方法淺克隆與深克隆的使用方法,需要的朋友可以參考下
本文實例講述了JQuery中clone方法復制節點。分享給大家供大家參考。具體如下：
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
- "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <title>復制節點</title>
- <style type="text/css">
- #main{
- width:300px;
- margin:200px auto;
- background-color:gold;
- padding:10px;
- }
- </style>
- <script src="js/jquery-1.5.1.min.js" type="text/javascript"></script>
- <script type="text/javascript">
- $(function () {
- var $text = $("#txt1");
- $text.click(function () { alert('我是文本框單擊事件'); });
- $("#btn1").click(function () {
- $("#btn1").after($text.clone()); //淺克隆(不復制事件)
- });
- $("#btn2").click(function () {
- $("#btn2").after($text.clone(true)); //深克隆(復制事件)
- });
- });
- </script>
- </head>
- <body>
- <div id="main">
- <input type="text" value="我是文本框" id="txt1" />
- <input type="button" id="btn1" value="進行淺克隆(不復制事件)" />
- <input type="button" id="btn2" value="進行深克隆(復制事件)" />
- </div>
- </body>
- </html>
希望本文所述對大家的jQuery程序設計有所幫助。
新聞熱點
疑難解答
圖片精選
