masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu

tetapan jQuery

Menetapkan kandungan - text(), html() dan val()

Kami akan menggunakan tiga kaedah yang sama dari bab sebelumnya untuk menetapkan kandungan:

text() - Menetapkan atau mengembalikan kandungan teks elemen yang dipilih html() - Menetapkan atau mengembalikan kandungan elemen yang dipilih (termasuk tag HTML) val() - Menetapkan atau mengembalikan nilai medan borang

Di bawah Contoh menunjukkan cara untuk menetapkan kandungan melalui kaedah text(), html() dan val()

Fungsi panggil balik text(), html() dan val()

Tiga kaedah jQuery di atas: text(), html() dan val() juga mempunyai fungsi panggil balik. Fungsi panggil balik mengambil dua parameter: indeks elemen semasa dalam senarai elemen yang dipilih dan nilai asal (lama). Kemudian kembalikan rentetan yang anda ingin gunakan sebagai nilai baharu fungsi tersebut.


Tetapkan atribut - attr()

kaedah jQuery attr() juga digunakan untuk menetapkan/menukar nilai atribut. Kaedah 

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
  $("button").click(function(){
    $("#php").attr("href","http://www.php.cn/jquery");
  });
});
</script>
</head>
<body>
<p><a href="http://www.php.cn" id="php">php中文网</a></p>
<button>修改 href 值</button>
<p>点击按钮修改后，可以点击链接查看链接地址是否变化。</p>
</body>
</html>

attr() juga membenarkan anda menetapkan berbilang atribut pada masa yang sama


attr() fungsi panggil balik

kaedah jQuery attr() juga menyediakan fungsi panggil balik. Fungsi panggil balik mengambil dua parameter: indeks elemen semasa dalam senarai elemen yang dipilih dan nilai asal (lama). Kemudian kembalikan rentetan yang anda ingin gunakan sebagai nilai baharu fungsi tersebut.


Meneruskan pembelajaran
||
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"> </script> <script> $(document).ready(function(){ $("#btn1").click(function(){ $("#test1").text(function(i,origText){ return "旧文本: " + origText + " 新文本: Hello world! (index: " + i + ")"; }); }); $("#btn2").click(function(){ $("#test2").html(function(i,origText){ return "旧 html: " + origText + " 新 html: Hello <b>world!</b> (index: " + i + ")"; }); }); }); </script> </head> <body> <p id="test1">这是一个有 <b>粗体</b> 字的段落。</p> <p id="test2">这是另外一个有 <b>粗体</b> 字的段落。</p> <button id="btn1">显示 新/旧 文本</button> <button id="btn2">显示 新/旧 HTML</button> </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)  492837 permainan