masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu

jQuery memasukkan prepend() dan prependTo()

Selain memasukkan kandungan tertentu di hujung elemen yang dipilih (masih di dalam) melalui append dan appendTo, anda juga boleh memasukkannya sebelum elemen yang dipilih Kaedah yang disediakan oleh jQuery adalah prepend dan Penerangan prependTo

pemilih:

3.png

Mari kita tulis contoh untuk menerangkan Kodnya adalah seperti berikut: 

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>prepend与prependTo</title>
    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
    <ul>
        <li id="li1">php 中文网</li>
        <li id="li2">php.cn</li>
    </ul>

    <input type="button" id="ipt1" value="prepend">
    <input type="button" id="ipt2" value="prependTo">

    <script>
        $("#ipt1").click(function(){
            $('#li1').prepend("欢迎</br>");
        })

        $("#ipt2").click(function(){
            $('#li2').prepend("欢迎</br>");
        })
    </script>
</body>
</html>

Nota: prepend( ) dan .prependTo() implement. fungsi yang sama. Perbezaan utama ialah sintaks, kandungan yang disisipkan dan lokasi sasaran

Berikut ialah ringkasan perbezaan antara empat kaedah operasi dalaman:

tambah( ) Tambahkan kandungan pada setiap elemen padanan

prepend() Tambahkan kandungan pada setiap elemen padanan

appendTo() Tambahkan semua elemen padanan pada elemen lain yang ditentukan Dalam koleksi

prependTo() menambah semua elemen padanan ke koleksi elemen lain yang ditentukan


Meneruskan pembelajaran
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>prepend与prependTo</title> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> </head> <body> <ul> <li id="li1">php 中文网</li> <li id="li2">php.cn</li> </ul> <input type="button" id="ipt1" value="prepend"> <input type="button" id="ipt2" value="prependTo"> <script> $("#ipt1").click(function(){ $('#li1').prepend("欢迎</br>"); }) $("#ipt2").click(function(){ $('#li2').prepend("欢迎</br>"); }) </script> </body> </html>
serahkanTetapkan Semula Kod
Bahagian sebelumnya bahagian seterusnya
Senarai Tutorial
dapatkan bantuan
  • Cadangan kursus
  • Muat turun perisian kursus
Perisian kursus tidak tersedia untuk dimuat turun pada masa ini. Kakitangan sedang menganjurkannya. Sila beri perhatian lebih kepada kursus ini pada masa hadapan~

Pelajar yang telah menonton kursus ini juga sedang belajar

Tutorial video perdana dunia ThinkPHP 5.1 terkini (60 hari untuk menjadi kursus latihan dalam talian pakar PHP)  492482 permainan