bungkus manipulasi DOM jQuery()

Jika anda ingin membungkus elemen dengan elemen lain, iaitu, menambah elemen induk padanya Untuk pemprosesan sedemikian, JQuery menyediakan kaedah bungkus

.wrap(wrappingElement): dipadankan dalam koleksi Setiap. elemen dibalut dengan struktur HTML

Sebagai contoh, mari tulis contoh di bawah

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
    <p>php 中文网</p>


    <script>
        $("p").wrap("<div></div>");
    </script>
</body>
</html>

Rakan, lihat kod di atas, supaya kita menambah nod induk pada tag p. letakkan Salin kod untuk dijalankan secara setempat dan tekan F12 untuk melihat

wrap( function ): fungsi panggil balik yang mengembalikan kandungan HTML atau objek jQuery yang digunakan untuk membalut elemen yang sepadan

Kesan selepas penggunaan adalah sama seperti menghantar parameter secara langsung, kecuali kod boleh ditulis di dalam badan fungsi, kaedah penulisan berbeza

Mari kita lihat contoh:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title></title>
    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
    <p>php 中文网</p>

    <script>
        $('p').wrap(function(){
            return '<div>';
        })
    </script>
</body>
</html>

Kawan, anda boleh Jalankan yang kedua Sebenarnya, kesannya adalah sama seperti yang pertama, tetapi kaedah penulisannya berbeza

Nota: Fungsi wrap() boleh menerima sebarang rentetan. atau objek dan boleh dihantar ke fungsi kilang $() untuk menentukan struktur DOM. Struktur ini boleh bersarang beberapa tahap dalam, tetapi hanya perlu mengandungi unsur teras. Setiap elemen padanan akan dibalut oleh struktur ini. Kaedah ini mengembalikan set elemen asal supaya kaedah rantaian boleh digunakan kemudian.

Meneruskan pembelajaran

fail baharu

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> </head> <body> <p>php 中文网</p> <script> $("p").wrap("<div></div>"); </script> </body> </html>

serahkan Tetapkan Semula Kod

Operasi automatik