Atribut dan gaya jQuery (2)

Membaca dan mengubah suai struktur HTML elemen atau kandungan teks elemen adalah operasi DOM biasa jQuery menyediakan dua kaedah mudah untuk pemprosesan tersebut kaedah html()

Dapatkan kandungan HTML elemen padanan pertama dalam koleksi atau tetapkan kandungan html setiap elemen padanan Terdapat tiga penggunaan khusus:

.html (. ) Tanpa menghantar nilai, anda mendapat kandungan HTML elemen padanan pertama dalam koleksi

.html( htmlString ) Tetapkan kandungan html setiap elemen padanan

.html( function( index , oldhtml) ) digunakan untuk mengembalikan fungsi untuk menetapkan kandungan HTML

Nota: Kaedah .html() menggunakan atribut innerHTML DOM untuk pemprosesan, jadi perkara yang paling penting untuk diberi perhatian ialah menetapkan dan mendapatkan. Soalan, operasi ini adalah untuk keseluruhan kandungan HTML (bukan hanya kandungan teks)

Mari kita lihat beberapa contoh kaedah html() berikut

Bagaimana untuk menukar html Kandungan elemen dikodkan seperti berikut:

<!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>
    <div id="dv">php 中文網(wǎng)</div>


    <script type="text/javascript">
          $('#dv').html("ipnx.cn");
    </script>
</body>
</html>

Menukar kandungan teg div

Tambah kandungan

Sebagai contoh, contoh di atas , kita perlu menambahkan URL selepas ??ｐ中文網(wǎng), jadi bagaimana kita perlu melaksanakan

Sila lihat kod berikut:

<!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>
    <div id="dv">php 中文網(wǎng)</div>

    <script type="text/javascript">
          $('#dv').append("ipnx.cn");
    </script>
</body>
</html>

Seperti dalam contoh di atas, ini akan menambah www pada teg div kami URL .php.cn

kaedah selepas dan sebelum

selepas: Sisipkan kandungan HTML selepas semua elemen yang sepadan

sebelum: Sisipkan kandungan HTML sebelum semua elemen yang sepadan

Sebagai contoh, dalam contoh kami di atas, cara menambah kandungan sebelum atau selepas tag div

Contoh berikut:

<!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>
    <div id="dv">php 中文網(wǎng)</div>

    <script type="text/javascript">
          $('#dv').before("歡迎來到：");

          $("#dv").after("學習編程");
    </script>
</body>
</html>

kaedah text()

Dapatkan kandungan teks gabungan setiap elemen dalam set elemen padanan, termasuk keturunannya, atau menetapkan kandungan teks setiap elemen dalam elemen padanan yang ditetapkan kepada kandungan teks yang ditentukan. , terdapat tiga kegunaan khusus:

.text() Mendapatkan teks gabungan setiap elemen dalam set elemen padanan, termasuk keturunannya

.text( textString ) digunakan untuk menetapkan kandungan daripada elemen padanan Teks

.text( function(index, text) ) digunakan untuk mengembalikan fungsi

yang menetapkan kandungan teks Sila lihat contoh berikut:

<!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>
    <div id="dv">php 中文網(wǎng)</div>

    <script type="text/javascript">
          alert($('#dv').text());
    </script>
</body>
</html>

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> <div id="dv">php 中文網(wǎng)</div> <script type="text/javascript"> $('#dv').html("ipnx.cn"); </script> </body> </html>

serahkan Tetapkan Semula Kod

Operasi automatik