• 技术文章 >web前端 >js教程

    JQuery中clone方法复制节点

    巴扎黑巴扎黑2017-06-25 10:06:04原创662
    这篇文章主要介绍了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>
     <p id="main">
     <input type="text" value="我是文本框" id="txt1" />
     <input type="button" id="btn1" value="进行浅克隆(不复制事件)" />
     <input type="button" id="btn2" value="进行深克隆(复制事件)" />
     </p>
    </body>
    </html>

    以上就是JQuery中clone方法复制节点的详细内容,更多请关注php中文网其它相关文章!

    声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理
    上一篇:jQuery.clone() 函数实例详解 下一篇:利用 jQuery Clone进行复制操作
    大前端线上培训班

    相关文章推荐

    • javascript暂停功能如何实现• javascript如何改变HTML内容• javascript如何求图形的面积• javascript如何将数字转为字符串• javascript中字符串怎么转换成数组

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网