Kostum Atribut Data HTML Menggunakan Atribut Data-*
- Atribut name: yang harus terisi minimal satu karakter bertipe long, yang tidak menggunakan huruf kapital dan diawali dengan prefix 'data-'.
- Atribut value: dapat berupa tipe string apapun.
<!DOCTYPE html>
<html>
<head>
<script>
function showDetails(book)
{
var bookauthor = book.getAttribute("data-book-author");
alert(book.innerHTML
+ " is written by "
+ bookauthor
+ ".");
}
</script>
</head>
<body>
<h1>
Books
</h1>
<p>
Klik pada nama buku untuk mengetahui nama pengarang:
</p>
<ul>
<li
onclick="showDetails(this)"
id="elfan"
data-book-author="Elfan Mauludi">
Icha-icha Paradise
</li>
<li
onclick="showDetails(this)"
id="conquest_of_self"
data-book-author="Mahatma Gandhi">
Conquest of Self
</li>
<li
onclick="showDetails(this)"
id="broken_wings"
data-book-author="Sarojini Naidu">
Broken Wings
</li>
</ul>
</body>
</html>
Output:Books
Klik pada nama buku untuk mengetahui nama pengarang:
- Icha-icha Paradise
- Conquest of Self
- Broken Wings
Ketika book di klik, maka akan diperlihatkan nama dari pengarang yang terpisah dari kotak dialog.
- 3 Nilai Utama Penggunaan Atribut Draggable pada HTML
- Cara Membuat Data Drag and Drop pada Atribut Dropzone HTML
- 3 Nilai Utama Penggunaan Atribut Enctype pada HTML
- 9 Elemen yang dapat Diterapkan Atribut Form HTML
- 2 Contoh Program Penggunaan Atribut For pada HTML
- 6 Cara Penerapan Atribut Height pada Elemen HTML
- Cara Menampilkan dan Menyembunyikan Elemen Menggunakan Atribut Hidden HTML
5 komentar untuk "Kostum Atribut Data HTML Menggunakan Atribut Data-*"
Hubungi admin melalui Wa : +62-896-2414-6106
Respon komentar 7 x 24 jam, mohon bersabar jika komentar tidak langsung dipublikasi atau mendapatkan balasan secara langsung.
Bantu admin meningkatkan kualitas blog dengan melaporkan berbagai permasalahan seperti typo, link bermasalah, dan lain sebagainya melalui kolom komentar.
- Ikatlah Ilmu dengan Memostingkannya -
- Big things start from small things -
Apa fungsi atribut data-* pada dokumen html?
BalasHapusAtribut data-* pada HTML digunakan untuk menyimpan data kostum pribadi pada halaman atau aplikasi berbasis html. Nama atribut tidak boleh mengandung huruf besar apapun, dan harus minimal memiliki satu karakter setelah awalan "data-" nilai atribut yang dapat berupa string apa pun.
HapusApa yang dimaksud dengan atribut pada html?
BalasHapusAtribuat pada html digunakan untuk memberikan informasi tambahan atau tambahan tertentu tentang suatu elemen. Semua elemen HTML dapat memiliki atribut.
HapusAtribut pada html memberikan informasi tambahan tentang suatu elemen yang biasanya membutuhkan dua parameter berupa nama dan nilai atau value. Setiap nama pada parameter atribut memiliki beberapa value yang harus ditulis dalam tanda kutip pada dokumen html.
Hapus