Manipulasi atribut
Langkah 1: Siapkan Halaman HTML
Pastikan Anda telah menyertakan jQuery di halaman HTML Anda dengan menambahkan script berikut di dalam tag <head>
:
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
Langkah 2: Buat Struktur HTML
Buat elemen HTML yang akan Anda manipulasi atributnya. Misalnya, kita akan menggunakan elemen <img>
:
<img id="gambar" src="gambar.jpg" alt="Deskripsi Gambar">
Langkah 3: Manipulasi Atribut dengan jQuery
Anda dapat menggunakan jQuery untuk mengubah, mengambil, atau menghapus atribut pada elemen HTML. Berikut contoh-contohnya:
Mengubah Atribut
// Mengganti nilai atribut 'src'
$("#gambar").attr("src", "gambar-baru.jpg");
// Mengganti nilai atribut 'alt'
$("#gambar").attr("alt", "Deskripsi Gambar yang Baru");
Mengambil Nilai Atribut
// Mengambil nilai atribut 'src' dan menampilkannya di konsol
var srcValue = $("#gambar").attr("src");
console.log("Nilai atribut 'src' adalah: " + srcValue);
Menghapus Atribut
// Menghapus atribut 'alt'
$("#gambar").removeAttr("alt");
Langkah 4: Lihat Hasilnya
Pastikan untuk memeriksa perubahan atribut pada elemen HTML Anda di browser setelah mengimplementasikan kode di atas.
Dengan langkah-langkah ini, Anda dapat memanipulasi atribut elemen HTML dengan mudah menggunakan jQuery. Semoga tutorial ini membantu!