Latest web development tutorials

jQuery mengatur konten dan properti

Mengatur konten - teks (), html () dan val ()

Kami akan menggunakan metode yang sama seperti pada bab sebelumnya ditetapkan tiga unsur:

  • text () - Mengatur atau mengembalikan isi teks dari elemen yang dipilih
  • html () - Mengatur atau mengembalikan isi dari elemen yang dipilih (termasuk tag HTML)
  • val () - Mengembalikan nilai atau bentuk bidang

Contoh berikut menunjukkan bagaimana teks (), html () dan val () metode untuk mengatur konten:

contoh

$ ( "# Btn1"). Klik (function () {
$ ( "# Test1") teks ( "Halo dunia!") .;
});
$ ( "# Btn2"). Klik (function () {
$ ( "# Test2") html ( "<b> Halo dunia </ b>!") .;
});
$ ( "# Btn3"). Klik (function () {
$ ( "# Test3") val ( "w3big") .;
});

Coba »

teks (), html () dan val () fungsi callback

Di atas tiga metode jQuery: text (), html () dan val (), juga memiliki fungsi callback. Callback oleh dua parameter: elemen yang dipilih dalam daftar elemen di bawah standar saat ini, serta asli (lama) nilai. Maka fungsi mengembalikan nilai yang Anda ingin menggunakan string baru.

Contoh berikut menunjukkan teks dengan callback () dan html ():

contoh

$ ( "# Btn1"). Klik (function () {
$ ( "# Test1"). Text (function (i, origText) {
kembali "teks lama:" + origText + "baru text: Halo dunia (indeks :!" + i + ")";
});
});

$ ( "# Btn2"). Klik (function () {
$ ( "# Test2"). Html (function (i, origText) {
kembali "html tua:" + origText + "html baru: Hello <b> dunia </ b> (indeks :!" + i + ")";
});
});

Coba »

Set atribut - attr ()

Metode jQuery attr () digunakan untuk mengatur / mengubah nilai properti.

Contoh berikut menunjukkan bagaimana untuk mengubah nilai (pengaturan) Link atribut href:

contoh

$ ( "Button"). Klik (function () {
$ ( "# W3big") attr ( "href", "http://www.w3big.com/jquery");
});

Coba »

Metode attr () juga memungkinkan Anda untuk mengatur beberapa properti secara bersamaan.

Contoh berikut menunjukkan cara mengatur kedua href dan title atribut:

contoh

$ ( "Button"). Klik (function () {
$ ( "# W3big"). Attr ({
"Href": "http://www.w3big.com/jquery",
"Judul": "jQuery Tutorial"
});
});

Coba »

attr () fungsi callback

Metode jQuery attr (), juga menyediakan fungsi callback. Callback oleh dua parameter: elemen yang dipilih dalam daftar elemen di bawah standar saat ini, serta asli (lama) nilai. Maka fungsi mengembalikan nilai yang Anda ingin menggunakan string baru.

Contoh berikut mengilustrasikan dengan metode fungsi callback attr ():

contoh

$("button").click(function(){
$("#w3big").attr("href", function(i,origValue){
return origValue + "/jquery";
});
});

Coba »