Mendapatkan Nama Elemen HTML Menggunakan getElementsByName DOM
 |
| Ilustrasi getElementsByName DOM HTML |
document.getElementsByName(name)
Parameter: fungsi ini menerima nama dari dokumen.
Catatan: dengan menggunakan method length, maka dapat ditemukan total dari elemen yang ditampilkan di dalam elemen tertentu. Namun, jika method getElementByName() tidak ada, maka method yang dapat digunakan adalah getElementsByName(), dengan tambahan huruf 's'.
Contoh:
<!DOCTYPE html>
<html>
<head>
<title>
getElementsByName() DOM
</title>
<style>
body
{
text-align: center;}
h1
{
color: green;}
</style>
<script>
// membuat fungsi untuk menampilkan angka dari elemen pada nama tertentu
function bons()
{
// Mengambil daftar dari nama elemen bawah 'ga'
var x = document.getElementsByName("ga");
// Mencetak angka dari elemen didalam tag alert
alert("Total element dengan nama ga adalah: " + x.length);
}
</script>
</head>
<body>
<h1>
Blog Elfan
</h1>
<h2>
Method getElementsByName() DOM
</h2>
<!-- Menciptakan tag dengan nama 'ga' -->
<h4
name="ga">
makan
</h4>
<h4 name="ga">
dan
</h4>
<h4 name="ga">
minum
</h4>
<input
type="button"
onclick="bons()"
value="Klik Disini" />
</body>
</html>
Blog Elfan
Method getElementsByName() DOM
makan
dan
minum
Karena method document.getElementsByName() mengembalikan nilai array yang mengandung object, maka jika ingin mendapatkan nilai dari object apapun harus menggunakan document.getElementsByName(“element_name”)[index].value. Jika tidak, maka akan didapatkan hasil yang tidak terdefinisi.
<!DOCTYPE html>
<html>
<head>
<title>
getElementsByName() DOM
</title>
<style>
body
{
text-align: center;}
h1
{
color: green;}
</style>
<script>
// Membuat fungsi untuk
// menampilkan elemen pada
// nama tertentu
function bons()
{
// Baris ini akan mencetak
// hasil masukkan
alert(document.getElementsByName("ga")[0].value);
}
</script>
</head>
<body>
<h1>
Blog Elfan
</h1>
<h2>
Method getElementsByName() DOM
</h2>
<!-- Mencetak tag input -->
<input
type="text"
name="ga" />
<br>
<br>
<!-- Fungsi akan dipanggil
ketika tombol di klik -->
<input
type="button"
onclick="bons()"
value="Klik Disini" />
<p></p>
</body>
</html>
Blog Elfan
Method getElementsByName() DOM
- 2 Contoh Penggunaan Properti Implementation DOM pada HTML [klik]
- 2 Contoh Penggunaan Method importNode() DOM pada HTML [klik]
- Cara Penggunaan Properti inputEncoding DOM pada HTML [klik]
- Cara Penggunaan Properti lastModified DOM pada HTML [klik]
- 3 Contoh Penggunaan Link Collection pada DOM HTML [klik]
- Cara Penggunaan Method normalize() DOM pada HTML [klik]
- Cara Penggunaan Method normalizeDocument() DOM pada HTML [klik]
Jenis browser apa saja yang dapat digunakan untuk mengaktifkan method getElementsByName pada DOM HTML?
BalasHapusBerikut adalah beberapa jenis browser yang dapat digunakan untuk mengaktifkan method getElementsByName() pada dom html:
Hapus1. Chrome
2. Internet Explorer
3. Firefox
4. Opera
5. Safari
Apa fungsi method getElementsByName() pada dom html?
BalasHapusMethod getElementsByName() berfungsi untuk mengembalikan kumpulan semua elemen dalam dokumen dengan nama yang telah ditentukan pada nilai atribut name, sebagai bagian dari object HTMLCollection. Object HTMLcollection mewakili kumpulan node, dimana node tersebut dapat diakses melalu nomor indeks.
HapusMethod getElementsByName() dari object dokumen mengembalikan kumpulan elemen NodeList beserta nama atribut yang diberikan didalam dokumen tersebut.
Hapus