Jquery 複製節點

<!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">
     .imgclass{ width:200px; height:200px;}
    </style>
    <script src="jquery-1.9.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $('#img1').click(function () {
                //如果clone()方法的參數爲true,則此元素的事件也會被複制,如果爲空(默認爲false),則事件不會被複制
                $(this).clone(true).appendTo('div');
            })
            $('#img1').mouseover(function () {
                alert('ok');
            })
            $('#Button1').click(function () {
                alert($('img').length);
            })
            $('#Button2').click(function () {
                //$('#img1').attr('src','images/3.jpg');
                //alert($('#img1').length);
                //無論複製多少份,無論參數是否爲true,無論複製之後,複製品的id是否與正品的Id一樣,文檔中始終只有一個此id的元素。
                alert($('.imgclass').length);
            })
        })

    </script>
</head>
<body>
<img src="images/2.jpg" id="img1" class="imgclass" />
    <input id="Button1" type="button" value="button" />
     <input id="Button2" type="button" value="更換圖片" />
<div></div>
</body>
</html>

發佈了133 篇原創文章 · 獲贊 3 · 訪問量 6萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章