Simpan dengan nama file “Latihan javascript Panjang Nama.
html”
<html>
<head><title>Latihan javascript panjang nama</title></head>
<body>
<script language=javascript>
var nama = prompt('Nama anda ? ', '')
panjang = [Link]
[Link]("<center>SELAMAT DATANG DI WEBSITE KAMI, "
+nama+ "<center><br><br><hr>");
[Link]("NAMA ANDA ADALAH : " +nama);
[Link]("<br> PANJANG NAMA ANDA ADALAH : "
+panjang+ " KARAKTER");
</script>
</body>
</html>
Simpan dengan nama file “Latihan javascript [Link]”
<html>
<head><title>Latihan JavaScript berhitung</title></head>
<script language=javascript>
var nilai1 = prompt('Masukan nilai ke 1 ','');
var nilai2 = prompt('Masukan nilai ke 2 ','');
function tambah()
{
var nilai3 = parseInt(nilai1) + parseInt(nilai2);
[Link]("Hasil dari " +nilai1+ " + " +nilai2+ " =
" +nilai3);
}
function kurang()
{
var nilai3 = parseInt(nilai1) - parseInt(nilai2);
[Link]("Hasil dari " +nilai1+ " - " +nilai2+ " =
" +nilai3);
}
function kali()
{
var nilai3 = parseInt(nilai1) * parseInt(nilai2);
[Link]("Hasil dari " +nilai1+ " * " +nilai2+ " =
" +nilai3);
}
function bagi()
{
var nilai3 = parseInt(nilai1) / parseInt(nilai2);
[Link]("Hasil dari " +nilai1+ " / " +nilai2+ " =
" +nilai3);
}
</script>
<a href="javascript: tambah();">Tambah</a><br>
<a href="javascript: kurang();">Kurang</a><br>
<a href="javascript: kali();">Kali</a><br>
<a href="javascript: bagi();">Bagi</a><br>
</body>
</html>
Simpan dengan nama file “Latihan javascript [Link]”
<html>
<head>
<title>Latihan JavaScript Password</title>
<script language="javascript">
var pesan = "Dilarang Masuk selain Petugas!";
function warning()
{
alert(pesan);
}
function password()
{
var passwd = prompt("Masukkan Password");
if (passwd != 'petugas')
{
alert('PASSWORD SALAH');
}
else
{
alert('PASSWORD BENAR');
var nama = prompt(' Nama anda ? ', '');
[Link]("<center>Selamat Datang di website kami,
"+nama+ "<center>");
}
}
</script>
</head>
<body onload="warning();">
<p><b>TEMPAT RAHASIA</b></p>
<p>Sekali lagi saya tegaskan jangan memasuki area ini selain
petugas.
BERBAHAYA!!!</p>
<a href="javascript: password();">Masuk --></a>
</body>
</html>
Simpan dengan nama file “Latihan javascript even [Link]”
<html>
<head><title>Latihan JavaScript even onLoad</title></head>
<body onLoad="javascript : alert('Selamat Datang di Web Sederhana
Ini');">
<center>
INI ADALAH WEB SEDERHANA SAYA
</center>
</body>
</html>
Simpan dengan nama file “Latihan [Link]”
<HTML>
<head><title>css1</title>
<STYLE>
.box{
background-color:green;
color: yellow;
width:100px;
height:100px;
margin-bottom:50px;
border:solid 5px black;
}
</STYLE>
</head>
<BODY>
<div class="box"> Box ke satu </div>
<div class="box"> Box ke dua </div>
</BODY>
</HTML>
Simpan dengan nama file “Latihan [Link]”
<HTML>
<head><title>Contoh Template CSS</title>
<STYLE>
#wrapper{
width : 960px;
margin : 0 auto; /*agar wrapper tetap berada ditengah */
}
#header {
width:100%;
height:50px;
background: orange;
margin-bottom: 10px;
}
#content{
padding:20px;
overflow:hidden;
background : green;
margin-bottom : 10px;
}
#artikel{
width : 600px;
height : 700px;
float : left;
background: orange;
overflow:hidden;
}
#artikel .kolom{
width : 559px;
height : 200px;
float: left;
margin:10px;
padding:0 20px 0 0;
background: #BAEBE6;
}
#artikel .kolom:last-child{backround:none;}
#sidebar {
width : 300px;
height: 200px;
float : right;
background: orange;
}
#footer{
width : 100%;
height: 50px;
background: #E0E0E0;
}
#social{
width:30px;
height: 100px;
position:fixed;
left:0px;
top:100px;
background: red;
}
</STYLE>
</head>
<BODY>
<div id="wrapper">
<div id="header"><h1><marquee>HEADER</marquee></h1></div>
<div id="content">
<div id="artikel">Ini adalah artikel 1
<div class="kolom">ini kolom artikel k1</div>
<div class="kolom">ini kolom artikel k2</div>
<div class="kolom">ini kolom artikel k3</div>
</div>
<div id="sidebar"><marquee
direction="up">slidebar</marquee></div>
<div style="clear:both;"></div>
</div>
<div id="footer">footer</div>
</div>
<div id="social"></div>
</BODY>
</HTML>
Simpan dengan nama file “Latihan [Link]”
<html>
<head><title>latihan CSS3</title></head>
<body>
<span style="cursor:auto">contoh auto</span><br>
<span style="cursor:default">contoh default</span><br>
<span style="cursor:crosshair">contoh
crosshair</span><br>
<span style="cursor:pointer">contoh pointer</span><br>
<span style="cursor:move">contoh move</span><br>
<span style="cursor:e-resize">contoh e-resize</span><br>
<span style="cursor:ne-resize">contoh ne-
resize</span><br>
<span style="cursor:nw-resize">contoh nw-
resize</span><br>
<span style="cursor:n-resize">contoh n-resize</span><br>
<span style="cursor:se-resize">contoh se-
resize</span><br>
<span style="cursor:sw-resize">contoh sw-
resize</span><br>
<span style="cursor:s-resize">contoh s-resize</span><br>
<span style="cursor:w-resize">contoh w-resize</span><br>
<span style="cursor:text">contoh text</span><br>
<span style="cursor:wait">contoh wait</span><br>
<span style="cursor:help">contoh help</span>
</body>
</html>