亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

jQuery traversal add() kaedah

jQuery ialah objek koleksi Selepas mencari koleksi elemen yang ditentukan melalui kaedah $(), satu siri operasi boleh dilakukan. Selepas $(), ini bermakna objek koleksi sudah ditentukan Apakah yang perlu dilakukan jika anda perlu menambah elemen baharu pada koleksi ini nanti? jQuery menyediakan kaedah tambah untuk ini, yang digunakan untuk mencipta objek jQuery baharu , elemen itu ditambahkan pada set elemen yang dipadankan

Hujah untuk menambah() boleh menerima hampir mana-mana $(), termasuk ungkapan pemilih jQuery, elemen DOM atau rujukan serpihan HTML.

Lihat sahaja kes:

Operasi: Pilih semua elemen li, dan kemudian tambah elemen p pada koleksi li

<ul> > <li>senarai item 1</li>
<li>senarai item 3</li>
</ul>
<p>Elemen p baharu</ p>

Proses 1: Lulus pemilih

$('li').add('p')


Proses 2: Lulus Elemen dom

$('li').add(document.getElementsByTagName('p')[0])


Cara lain ialah membuat teg P secara dinamik dan menambahkannya pada koleksi , dan kemudian masukkannya ke dalam kedudukan yang ditentukan, tetapi ini mengubah susunan elemen itu sendiri

$('li').add('<p>Elemen p baharu</p>'). kedudukan sasaran)


<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title></title>
    <style>
    .left {
        width: auto;
        height: 150px;
    }
    
    .left div {
        width: 150px;
        height: 120px;
        padding: 5px;
        margin: 5px;
        float: left;
        background: #bbffaa;
        border: 1px solid #ccc;
    }
    </style>
    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>

<body>
    <h2>add方法()</h2>
    <div class="left first-div">
        <div class="div">
            <ul>
                <li>list item 1</li>
                <li>list item 2</li>
                <li>list item 3</li>
            </ul>
            <p>新的p元素</p>
        </div>
    </div>
    <div class="right"></div>
    <br/>
    <button>點(diǎn)擊：add傳遞元素標(biāo)簽</button>
    <button>點(diǎn)擊：add傳遞html結(jié)構(gòu)</button>
    <script type="text/javascript">
    $("button:first").click(function() {
         //把p元素添加到li的合集中
         $('li').add('p').css('background', 'red')
    })
    </script>
    <script type="text/javascript">
    $("button:last").click(function() {
         //把html結(jié)構(gòu)'<p>新的p元素</p>'
         //加入到li的合集中，為了能夠在頁面上顯示
         //需要再重新appendTo到指定的節(jié)點(diǎn)處
         //值得注意：整個(gè)結(jié)構(gòu)位置都改變了
         $('li').add('<p>新的p元素</p>').appendTo($('.right'))
    })
    </script>
</body>

</html>


Meneruskan pembelajaran
||
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <title></title> <style> .left { width: auto; height: 150px; } .left div { width: 150px; height: 120px; padding: 5px; margin: 5px; float: left; background: #bbffaa; border: 1px solid #ccc; } </style> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> </head> <body> <h2>add方法()</h2> <div class="left first-div"> <div class="div"> <ul> <li>list item 1</li> <li>list item 2</li> <li>list item 3</li> </ul> <p>新的p元素</p> </div> </div> <div class="right"></div> <br/> <button>點(diǎn)擊：add傳遞元素標(biāo)簽</button> <button>點(diǎn)擊：add傳遞html結(jié)構(gòu)</button> <script type="text/javascript"> $("button:first").click(function() { //把p元素添加到li的合集中 $('li').add('p').css('background', 'red') }) </script> <script type="text/javascript"> $("button:last").click(function() { //把html結(jié)構(gòu)'<p>新的p元素</p>' //加入到li的合集中，為了能夠在頁面上顯示 //需要再重新appendTo到指定的節(jié)點(diǎn)處 //值得注意：整個(gè)結(jié)構(gòu)位置都改變了 $('li').add('<p>新的p元素</p>').appendTo($('.right')) }) </script> </body> </html>