Pada kesempatan kali ini saya akan menjelaskan cara membuat dinamyc get content dengan javascript. Perlu teman-teman ketahui sebelumnya, maksud dari penjelasan disini adalah mengambil isi dari text hiperlink atau tag <a> dengan event onclick, namun pada kasus disini dimana untuk menerapkan event onclick dari masing-masing hiperlink tersebut harus menggunakan perulangan karena menggunakan DOM HTML docment getElementsByClassName() yang membutuhkan penentuan index nya dari masing-masing element hyperlink tersebut. Langsung saja untuk membuatnya teman-teman bisa ikuti tahapan yang saya berikan dibawah ini.

Berikut Tahapannya :

  • Teman-teman buat terlebih dahulu satu buah file dengan nama index.html
  • Selanjutnya jika sudah ketikan seperti kode berikut :
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Cara Membuat Dinamyc Get Content Dengan JavaScript</title>
</head>
<body>
	<h3>Cara Membuat Dinamyc Get Content Dengan JavaScript</h3>
	<nav class="form-group">
	<a href="#" class="btn btn-sm btn-default">Home</a>
	<a href="#" class="btn btn-sm btn-info">Product</a>
	<a href="#" class="btn btn-sm btn-danger">Services</a>
	<a href="#" class="btn btn-sm btn-danger">Contact Us</a>
	</nav>
	<span>you choose: <strong id="cetak"></strong></span>
</body>
</html>
 
<script>
var button = document.getElementsByClassName("btn"),
    len = button.length,
    i;
function click(){
   document.getElementById("cetak").textContent = this.innerText; 
}
for(i=0;i<len;i+=1){
  button[i].onclick=click;
}
</script>
  • Jika sudah selanjutnya simpan terlebih dahulu file index.html tersebut.
  • Dan lihat hasilnya di browser kesayangan teman-teman.

Sampai disini penjelasan saya mengenai cara membuat dinamyc get content dengan javascript, semoga bermanfaat.