Tempat menaruh JavaScript bisa di dalam tag html <head> dan tag html <body>, tergantung fungsi yang kita inginkan.
Contoh:
<!DOCTYPE html>
<html>
<body>
<h1>Halaman JS</h1>
<p id="tampil">Contoh</p>
<script type="text/javascript">
<html>
<body>
<h1>Halaman JS</h1>
<p id="tampil">Contoh</p>
<script type="text/javascript">
<!--
document.getElementById("tampil").innerHTML="Hello World!";
//-->
</script>
</body>
</html>
</body>
</html>
Penjelasan: JavaScipt diletakan di bawah tag <p>, karena untuk mengesekusi JavaScript kita terlebih dahulu mendefinisikan tag html dengan id tampil (lihat scipt document.getElementById("tampil").innerHTML). setelah di definisikan baru taruh JavaSciptnya, hal ini dilakukan karena jika tidak JavaScript tidak akan mengenali Id, sehingga terjadinya error.
Terkadang kita ingin mengeksekusi JavaScript ketika suatu peristiwa terjadi, seperti ketika pengguna mengklik tombol. Permasalahan ini dapat diatasi dengan menggunakan function.
Contoh:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function myFunction()
{
document.getElementById("tampil").innerHTML="Ini contoh function";
}
</script>
</head>
<body>
<h1>Halaman JS<</h1>
<p id="tampil">Contoh</p>
<button type="button" onclick="myFunction()">Click Me</button>
</body>
</html>
<html>
<head>
<script type="text/javascript">
function myFunction()
{
document.getElementById("tampil").innerHTML="Ini contoh function";
}
</script>
</head>
<body>
<h1>Halaman JS<</h1>
<p id="tampil">Contoh</p>
<button type="button" onclick="myFunction()">Click Me</button>
</body>
</html>
Contoh lainya:
<!DOCTYPE html>
<html>
<body>
<h1>Halaman JS<</h1>
<html>
<body>
<h1>Halaman JS<</h1>
<p id="tampil">Contoh</p>
<button type="button" onclick="myFunction()">Click Me</button>
<script type="text/javascript">
function myFunction()
{
document.getElementById("demo").innerHTML="Ini contoh function";
}
</script>
</body>
</html>
</script>
</body>
</html>
Untuk penjelasanya lebih baik anda mencoba script diatas, kenapa? supaya anda lebih paham dan mengerti. Dan untuk pembahasan lebih lanjut tentang function nanti di artikel selanjutnya.
0 komentar: