jQuery - Dapatkan Konten dan Atribut


jQuery berisi metode yang kuat untuk mengubah dan memanipulasi elemen dan atribut HTML.


Manipulasi DOM jQuery

Salah satu bagian yang sangat penting dari jQuery adalah kemungkinan untuk memanipulasi DOM.

jQuery hadir dengan banyak metode terkait DOM yang memudahkan untuk mengakses dan memanipulasi elemen dan atribut.

DOM = Model Objek Dokumen

DOM mendefinisikan standar untuk mengakses dokumen HTML dan XML:

"Model Objek Dokumen W3C (DOM) adalah platform dan antarmuka bahasa-netral yang memungkinkan program dan skrip untuk mengakses dan memperbarui konten secara dinamis, struktur, dan gaya dokumen."


Dapatkan Konten - teks(), html(), dan val()

Tiga metode jQuery yang sederhana namun bermanfaat untuk manipulasi DOM adalah:

  • text() - Mengatur atau mengembalikan konten teks dari elemen yang dipilih
  • html() - Mengatur atau mengembalikan konten elemen yang dipilih (termasuk markup HTML)
  • val() - Menetapkan atau mengembalikan nilai bidang formulir

Contoh berikut menunjukkan cara mendapatkan konten dengan jQuery text()dan html()metode:

Contoh

$("#btn1").click(function(){
  alert("Text: " + $("#test").text());
});
$("#btn2").click(function(){
  alert("HTML: " + $("#test").html());
});

Contoh berikut menunjukkan cara mendapatkan nilai bidang input dengan val()metode jQuery:

Contoh

$("#btn1").click(function(){
  alert("Value: " + $("#test").val());
});


Dapatkan Atribut - attr()

Metode jQuery attr()digunakan untuk mendapatkan nilai atribut.

Contoh berikut menunjukkan cara mendapatkan nilai atribut href di tautan:

Contoh

$("button").click(function(){
  alert($("#w3s").attr("href"));
});

Bab berikutnya menjelaskan cara mengatur (mengubah) konten dan nilai atribut.


Latihan jQuery

Uji Diri Anda Dengan Latihan

Olahraga:

Gunakan metode jQuery untuk mengembalikan konten teks dari elemen <div>.

$("div").();


Referensi HTML jQuery

Untuk gambaran lengkap tentang semua metode HTML jQuery, silakan kunjungi Referensi HTML/CSS jQuery kami .