Materi :
1. Mengenal fungsi
2. Memanfaatkan fungsi
Latihan 1.
1. Buka notepad
2. Ketikkan struktur html
<html>
<head>
<title>Latihan Fungsi</title>
</head>
<body>
</body>
</html>
|
3. Simpan kode dengan nama lat101.html
4. Buka file lat101.html dari web browser
Hasil:
<html>
<head>
<title>Latihan Fungsi</title>
<script>
function pesan()
{
alert('Seribu langkah Dimulai Dari 1 Langkah');
}
</script>
</head>
<body>
<form>
<input type=button value="click" onclick="alert('Web Programming')">
<input type=button value="Pesan Hari Ini" onclick="pesan()">
</form>
</body>
</html>
|
![]() | ||
Gambar 1. Antar Muka Menjumlahkan 2 Buah Bilangan
Jawab :
1. Buka notepad baru
2. Ketikkan struktur html
<html>
<head>
<title>Latihan Fungsi-2</title>
</head>
<body>
</body>
</html>
|
3. Simpan kode dengan nama lat102.html
4. Buka file lat102.html dari web browser
5. Rancang form seperti gambar 1
Kode html:
<html>
<head>
<title>Latihan Fungsi-2</title>
<script>
function jumlah()
{
var a,b,c;
//simpan nilai txta ke variabel a dan ubah menjadi angka
a=parseInt(document.getElementById('txta').value);
//simpan nilai txtb ke variabel b dan ubah menjadi angka
b=parseInt(document.getElementById('txtb').value);
//jumlahkan a + b dan simpan di c
c=a+b;
//tampilkan nilai c di tctc
document.getElementById('txtc').value=c;
}
function kali()
{
//deklarasikan variabel untuk menampung nilai txta, //txtb dan txtc
var a,b,c;
//simpan nilai txta ke variabel a dan ubah menjadi angka
a=parseInt(document.getElementById('txta').value);
//simpan nilai txtb ke variabel b dan ubah menjadi angka
b=parseInt(document.getElementById('txtb').value);
//kalikan a * b dan simpan di c
c=a*b;
//tampilkan nilai c di tctc
document.getElementById('txtc').value=c;
}
function bagi()
{
//deklarasikan variabel untuk menampung nilai txta, //txtb dan txtc
var a,b,c;
//simpan nilai txta ke variabel a dan ubah menjadi angka
a=parseInt(document.getElementById('txta').value);
//simpan nilai txtb ke variabel b dan ubah menjadi angka
b=parseInt(document.getElementById('txtb').value);
//bagikan a / b dan simpan di c
c=a/b;
//tampilkan nilai c di tctc
document.getElementById('txtc').value=c;
}
function kurang()
{
//deklarasikan variabel untuk menampung nilai txta, //txtb dan txtc
var a,b,c;
//simpan nilai txta ke variabel a dan ubah menjadi angka
a=parseInt(document.getElementById('txta').value);
//simpan nilai txtb ke variabel b dan ubah menjadi angka
b=parseInt(document.getElementById('txtb').value);
//kurangkan a - b dan simpan di c
c=a-b;
//tampilkan nilai c di tctc
document.getElementById('txtc').value=c;
}
</script>
</head>
<body bgcolor=brown>
<form>
<table align=center bgcolor=yellow width=200px>
<tr>
<td colspan=3 align=center><marquee>Menjumlahkan Dua Buah bilangan</marquee></td>
</tr>
<tr>
<td>Bilangan A</td>
<td>:</td>
<td><input type=text size=5 id=txta></td>
</tr>
<tr>
<td>Bilangan B</td>
<td>:</td>
<td><input type=text size=5 id=txtb></td>
</tr>
<tr>
<td colspan=3 align=center>
<input type=button value=" + " onclick="jumlah()">
<input type=button value=" * " onclick="kali()">
<input type=button value=" / " onclick="bagi()">
<input type=button value=" - " onclick="kurang()">
</tr>
<tr>
<td>A + B</td>
<td>:</td>
<td><input type=text size=5 id=txtc></td>
</tr>
</table>
</form>
</body>
</html>
|
Outputnya adalah seperti gambar di atas



0 comments:
Post a Comment