this → Artikel Baru – ( Atrikel Lama ↓ )

2 Contoh Penggunaan Method getElementById() pada DOM HTML

Method getElementById() pada DOM HTML berfungsi untuk mengembalikan elemen yang memberikan ID yang dilewatkan untuk sebuah fungsi. Fungsi ini secara luas digunakan HTML DOM pada rancangan web untuk mengubah elemen apapun atau untuk mendapatkan elemen tertentu. Jika ID yang dilewatkan ke fungsi tidak tersedia, maka akan mengembalikan nilai null. Elemen dipersyaraktkan untuk memiliki sebuah id unik, supaya dapat mendapatkan akses menuju ke elemen spesifik secara cepat, dan juga id tertentu seharusnya hanya digunakan sekali saja pada seluruh dokumen.

Sintak:
document.getElementById( element_ID )

Parameter: fungsi ini menerima element_ID dari parameter tunggal yang digunakan untuk menampung ID dari sebuah elemen.

Return Value: method ini akan mengembalikan object yang diberikan dari sebuah ID. Jika tidak terdapat elemen apapun dengan jenis ID yang diberikan, maka method tersebut akan mengembalikan nilai null.

Pahami pula, tentang semua konsep desain Web untuk tingkat pemula melalui materi lengkap HTML [klik].


Contoh: deskripsi method getElementById(), dimana element_id digunakan untuk mengubah warna dari teks ketika melakukan klik tombol.

<!DOCTYPE html>

<html>

 

<head>

<title>

Method getElementById() DOM

</title>

 

<script>

// Fungsi untuk mengubah 

// warna dari elemen

function bons() 

{

var demo = document.getElementById("bons");

demo.style.color = "green";

}

</script>

</head>

 

<body style="text-align:center">

 

<h1 id="bons">

Blog Elfan

</h1>

 

<h2>

Method getElementById() DOM

</h2>

<!-- Klik tombol untuk 

mengubah warna -->

<input 

type="button"

onclick="bons()"

value="Klik untuk mengubah warna" />

 

</body>

 

</html>

Output:

Blog Elfan

Method getElementById() DOM



Baca juga, tentang materi bahasa pemrograman lainnya melalui Materi Lengkap 

Bahasa Pemrograman [klik].


Contoh: deskripsi method getElementById(), dimana element_id digunakan untuk mengubah konten ketika dilaukan klik tombol.

<!DOCTYPE html>

<html>

 

<head>

<title>

Method getElementById() DOM

</title>

 

<script>

// Fungsi untuk mengubah 

// konten dari elemen

function bons() 

{

var demo = document.getElementById("bons");

demo.innerHTML = "Selamat Datang!";

}

</script>

</head>

 

<body style="text-align:center">

 

<h1>

Blog Elfan

</h1>

 

<h2>

Method getElementById() DOM

</h2>

 

<h3 id="bons">

Selamat Siang!

</h3>

 

<!-- Klik untuk mengubah 

konten -->

<input 

type="button"

onclick="bons()"

value="Klik untuk mengubah konten" />

 

</body>

 

</html>

Output:

Blog Elfan

Method getElementById() DOM

Selamat Siang!

Komentar

  1. Apa fungsi method getElementById() DOM pada html?

    BalasHapus
    Balasan
    1. Method getElementById() berfungsi untuk mengembalikan elemen yang memiliki itribut ID dengan nilai yang telah ditentukan. Method ini adalah salah satu method yang paling umum digunakan pada DOM HTML setiap kali user ingin melakukan manipulasi pada elemen, atau untuk mendapatkan infor dari elemen saat ini.

      Hapus
    2. Method getElementById digunakan untuk mewakili Id elemen yang ingin dipilih. Method getElementById() digunakan untuk mengembalikan object elemen yang menjelaskan object elemen DOM dengan ID yang telah ditentukan, sebaliknya akan mengembalikan nilai null jika tidak ada elemen dengan jenis id tersebut.

      Hapus
  2. Jenis browser apa saja yang dapat digunakan untuk mengaktifkan method getElementById() pada dom html?

    BalasHapus
    Balasan
    1. Berikut adalah jenis browser yang dapat digunakan untuk mengaktifkan method getElementById() pada DOM HTML:
      1. Google Chrome 1.0
      2. Internet Explorer 5.5
      3. Microsoft Edge 12.0
      4. Firefox 1.0
      5. Opera 7.0
      6. Safari 1.0

      Hapus

Posting Komentar

Respon komentar 7 x 24 jam, mohon bersabar jika komentar tidak langsung dipublikasi atau mendapatkan balasan secara langsung. :D

Catatan: setiap iklan yang ditayangkan pada blog ini bersumber dari google adsense. Dengan jenis iklan yang dipilih adalah, sebagai berikut.

POIN 1, Iklan yang ditampilkan hanya boleh berbahasa indonesia atau berbahasa inggris. Tidak menerima jenis iklan dalam bahasa yang lain selain yang telah disebutkan karena blog ini dibuat untuk para pengunjung dari negara atau orang yang berbahasa Indonesia.

POIN 2, Setiap gambar yang ditampilkan pada iklan sifatnya tidak mengganggu para pengunjung yang melihat blog, atau tidak boleh menampilkan gambar yang bersifat menjijikkan atau merangsang rasa mual.

POIN 3, Jenis iklan yang dipasang bukan merupakan iklan spam, atau berisi dan mengarahkan pengunjung ke alamat yang berbahaya atau bersifat penipuan.

POIN 4, Segala bentuk iklan tunduk dan patuh pada ketentuan dari pihak Adsense google dan pemilik blog.

POIN 5, Segala jenis iklan yang tidak bertentangan dengan poin 1-4 yang dijelaskan sebelumnya, maka iklan tersebut dapat ditampilkan pada blog.



~ Ikatlah Ilmu dengan Memostingkannya ~

Hot Artikel

Enkapsulasi pada Java

Perbedaan stdio.h dan stdlib.h pada Bahasa C

10 Aturan Utama Penggunaan Overriding pada Java

5 Cara Konversi Tipe Data pada Java

Perbedaan Antara int main() dan int main(void) pada Bahasa C

Penjelasan Singkat tentang Konsep Asosiasi, Komposisi, dan Agregasi pada Java

6 Aturan Penting Switch Statement pada Java