Sesuai dengan judul kali ini saya akan belajar java script. Karena saya masih pemula maka tutorial ini hanya untuk pemula yah ^_^. Topik pembahasan javasript ini akan meluputi deklarasi variabel, membaca value dari sebuah form, mengeset value dari form elemen ataupun html.
JavaScript adalah bahasa pemrograman berbasis teks yang digunakan pada sisi klien dan sisi server yang memungkinkan Anda membuat halaman web interaktif. ... Memasukkan JavaScript meningkatkan pengalaman pengguna halaman web dengan mengonversinya dari halaman statis menjadi halaman interaktif. Untuk rekap, JavaScript menambahkan perilaku ke halaman web.
Ok sekarang mari kita mulai saja tutorial nya :
Dalam mendeklarasikan sebuah variabel dalam java script dapat dilakukan dengan cara
var namavariabel = 'Contoh deklarasi variabel pada java script';Untuk membuat alert pada javascript dapat dilakukan dengan cara
alert('Ini adalah contoh alert pada java script');
atau
alert(namavariabel);Untuk mendapatkan nilai dari tag html dapat dilakukan dengan beberapa cara
var x = document.getElementsByClass('Berdasarkan class')[0].innerHTML;var y = document.getElementById('Berdasarkan id').innerHTML;var z = document.getElementsByName("Berdasarkan nama")[0].innerHTML;Perintah perintah di atas adalah perintah untuk mendapatkan nilai dari sebuah tag html. Bagaimana caranya untuk mendapatkan nilai dari sebuah input form?
Caranya sangatlah mudah, perintah unutk mendapatkan nilai dari sebuah input form adalah dengan mengganti ".innterHTML" dengan ".Value"
Sedangkan cara untuk mengganti isi dari sebuah tag html atau form menambahkan kodingan di atas
z="Nilai baru";Biar gak bingung saya akan memberikan contoh coding javascript sederhana agar teman teman dapat mengerti
<!DOCTYPE html>
<html>
<head>
<title>Belajar Bahasa Pemrograman Javascript Untuk Pemula</title>
</head>
<body>
<div class="contoh">Get Element by ClassName</div>
<div id="contoh">Get Element By ID</div>
<div name="contoh">Get Element By Name</div>
<p>Contoh Javascript Sederhana By RumahCode.Org</p>
<button onclick="GetElement()">Get Element</button>
<button onclick="SetElement()">Set Element</button>
<script>
function GetElement() {
var x = document.getElementsByClassName("contoh")[0].innerHTML;
var y = document.getElementById("contoh").innerHTML;
var z = document.getElementsByName("contoh")[0].innerHTML;
alert(x);
alert(y);
alert(z);
}
function SetElement() {
document.getElementsByClassName("contoh")[0].innerHTML = "Value Baru Class Name";
document.getElementById("contoh").innerHTML = "Value Baru ID";
document.getElementsByName("contoh")[0].innerHTML = "Value baruName";
}
</script>
</body>
</html>
pada contoh coding javascript di atas saya juga menambahkan fungsi untuk di panggil dari sebuah button yang berada dalam event onClick.
