Perekomendan Kursus:

Mendapatkan Konten dan Atribut jQuery

jQuery memiliki metode kuat untuk mengoperasikan elemen dan atribut HTML.

Operasi DOM jQuery

Bagian yang sangat penting dalam jQuery adalah kemampuan untuk mengoperasikan DOM.

jQuery menyediakan berbagai metode yang berhubungan dengan DOM, yang membuat mengakses dan mengoperasikan elemen dan atribut menjadi mudah.Petunjuk:

DOM = Document Object Model (Model Objek Dokumen)

“Model Objek Dokumen W3C independen dari platform dan bahasa, memungkinkan program dan skrip mengakses dan memperbarui konten, struktur serta gaya dokumen secara dinamis.”

Dapatkan Konten - text(), html() serta val()

Tiga metode sederhana dan praktis untuk operasi DOM dengan jQuery:

  • text() - Tetapkan atau kembalikan konten teks elemen yang dipilih
  • html() - Tetapkan atau kembalikan konten elemen yang dipilih (termasuk tanda buku HTML)
  • val() - Tetapkan atau kembalikan nilai field formulir

Contoh di bawah ini menunjukkan bagaimana mendapatkan konten melalui metode jQuery text() dan html():

Contoh

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

Coba sendiri

Contoh di bawah ini menunjukkan bagaimana mendapatkan nilai input field melalui metode jQuery val():

Contoh

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

Coba sendiri

Mendapatkan Atribut - attr()

Metode attr() jQuery digunakan untuk mendapatkan nilai atribut.

Contoh di bawah ini menunjukkan bagaimana mendapatkan nilai atribut href di dalam tautan:

Contoh

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

Coba sendiri

Bab berikutnya akan menggambarkan bagaimana mengatur (mengubah) nilai konten dan atribut.

Panduan Referensi HTML jQuery

Untuk referensi lengkap tentang metode HTML jQuery, silakan kunjungi panduan referensi berikut: