Modul 7 ~ anrzero

Selasa, 23 Desember 2014

Modul 7

17.57

Unknown

Modul 7

Percobaan 1 (Javascript)

Langkah – langkahnya :

1.      Buka Aplikasi Notepad
2.      Ketikan script berikut :

3.   Simpan file dengan nama percobaan1.html
4.      Buka file dengan menggunakan browser

Percobaan 2 (MouseOver)

Langkah – langkahnya

1. Letakkan 2 buah file image berektensi .jpg dan beri nama kedua filetersebut masing–masing dengan nama gambar1.jpg dan gambar2.jpg

2. Buka Aplikasi Notepad

3. Ketikan script berikut ini :

4.      Simpan file dengan nama mouseover.html
5.      Buka file dengan menggunakan browser
6.      Arahkan pointer mouse ke gambar, amati yang terjadi gambar akan berubah dari gambar 1 ke gambar2.
7.   Hasilnya sebagai berikut :

Percobaan 3 (Character Counter)

Langkah – langkahnya :

1. Buka Aplikasi Notepad

2.      Ketikan script berikut ini :

3.      Simpan file dengan nama counter.html
4.      Buka file dengan menggunakan browser :
5. Hasilnya Sebagai berikut :

Perconaan 4 (Kalkulator Sederhana)

Langkah – langkahnya :

1. Buka Aplikasi Notepad

2. Ketikan script berikut ini :

<html>
<head>
<title>Kalkulator</title>
<script language='javascript'>
function tambah ()
{
nilaia=document.myform.a.value;
nilaib=document.myform.b.value;
tambah=parseInt(nilaia)+parseInt(nilaib);
document.myform.hasil.value=tambah;
}
function kurang()
{
nilaia=document.myform.a.value;
nilaib=document.myform.b.value;
kurang=nilaia-nilaib;
document.myform.hasil.value=kurang;
}
function kali()
{
nilaia=document.myform.a.value;
nilaib=document.myform.b.value;
kali=nilaia*nilaib;
document.myform.hasil.value=kali;
}
function bagi()
{
nilaia=document.myform.a.value;
nilaib=document.myform.b.value;
bagi=nilaia/nilaib;
document.myform.hasil.value=bagi;
}
</script>
</head>
<body>
<form name='myform'>
<h3>
Kalkulator Sederhana</h3>
</br>
Nilai A = <input type='text' name='a' size='5'></br>
Nilai B = <input type='text' name='b' size='5'></br></br>
<input type='button' name='aksi' value='+'
onclick='tambah()'>
<input type='button' name='aksi' value='-'
onclick='kurang()'>
<input type='button' name='aksi' value='*'
onclick='kali()'>
<input type='button' name='aksi' value='/'
onclick='bagi()'>
</br></br>
<b>Hasil = </br><input type='text' name='hasil' size='5'></br>
</form>
</body>
</html>

   3.      Simpan file dengan nama kalkulator.html
   4.      Buka file dengan menggunakan browser
   5.      Masukkan nilai A dan B, kemudian klik salah satu tanda operasi (+, -, *, /), amati hasilnya
   6.      Hasilnya sebagai berikut :

TUGAS
1. Buatlah aplikasi pengambilan keputusan sederhana menggunakan javascript yang menghitung nilai dengan ketentuan :

Jika Nilai 0 - 20 = E

Jika Nilai 21 - 40 = D

Jika Nilai 41 - 60 = C

Jika Nilai 61 - 80 = B

Jika Nilai 81 - 100 = A

Tuliskan scriptnya dan lampirkan hasil tampilan di browser.

Scriptnya sebagai berikut :

<html>
<head>
<title>Kalkulator</title>
<script language='javascript'>
function tambah ()
{
nilaia=document.myform.a.value;
nilaib=document.myform.b.value;
tambah=parseInt(nilaia)+parseInt(nilaib);
document.myform.hasil.value=tambah;
}
function kurang()
{
nilaia=document.myform.a.value;
nilaib=document.myform.b.value;
kurang=nilaia-nilaib;
document.myform.hasil.value=kurang;
}
function kali()
{
nilaia=document.myform.a.value;
nilaib=document.myform.b.value;
kali=nilaia*nilaib;
document.myform.hasil.value=kali;
}
function bagi()
{
nilaia=document.myform.a.value;
nilaib=document.myform.b.value;
bagi=nilaia/nilaib;
document.myform.hasil.value=bagi;
}
</script>
</head>
<body>
<form name='myform'>
<h3>
Kalkulator Sederhana</h3>
</br>
Nilai A = <input type='text' name='a' size='5'></br>
Nilai B = <input type='text' name='b' size='5'></br></br>
<input type='button' name='aksi' value='+'
onclick='tambah()'>
<input type='button' name='aksi' value='-'
onclick='kurang()'>
<input type='button' name='aksi' value='*'
onclick='kali()'>
<input type='button' name='aksi' value='/'
onclick='bagi()'>
</br></br>
<b>Hasil = </br><input type='text' name='hasil' size='5'></br>
</form>
</body>
</html>
<textarea>

</div>
</div>

Hasilnya sebagai berikut :