javascript basic

1111111 Intro
<!DOCTYPE>
<html>
                <head>
                                <title>
                                </title>
                </head>
                <body>
                                <p>blok 1</p>
                                                <script>
                                                alert('blog 1 dijalankan');
                                                </script>
                                <p>blok 2</p>
                                <script>
                                                document.bgColor="yellow";
                                                alert('blog 2 dijalankan');
                                                </script>
                                               
                               
                </body>
</html>

2. html
<!DOCTYPE>
<html>
                <head>
                                <title>
                                </title>
                </head>
                <body>
                <script>
                function ubahBg(){
                                alert('blog 2 dijalankan background berubah biru');
                                document.bgColor="blue";
                }
               
                function tampilkanPesan(isipesan){
                                alert('blog 1 dijalankan');                   
                }
               
                </script>
                                <p>blok 1</p>
                                                <script>
                                                tampilkanPesan('blok 1 jalan');
                                                </script>
                                <p>blok 2</p>
                                <script>
                                                ubahBg();                                              
                                                </script>
                                               
                               
                </body>
</html>

2 variable

<!DOCTYPE>
<html>
                <head>
                                <title>
                                </title>
                </head>
                <script>
                                //string
                                var nama="febrian";
                                var nama2;
                                //numeric
                                var umur=31;
                                //boolean
                                nama2="rizkiono";
                                alert(nama+' dan '+nama2);
                                alert(umur);
                </script>
                <body>
                                <div id="demo">paragraph</div>
                                <script type="text/javascript">
                                                var getCuy;
                                                getCuy = "Ini get nya y";
                                               
                                                document.getElementById("demo").innerHTML=getCuy;
                                </script>
                </body>
</html>

3.operator

<!DOCTYPE>
<html>
                <head>
                                <title>
                                </title>
                </head>
                <script>
                                var nilai;
                                var hasil;
                                nilai = 10;
                                hasil = nilai+10;
                                hasil1 = nilai+10;
                                hasil1 = hasil1+10;
                                hasil2 = nilai+10;
                                hasil2 += 10;
                               
                                hasil3=nilai;
                                hasil3+=3;
                               
                               
                                var hasil4=4;
                               
                                alert('hasil ='+hasil);
                                alert('hasil1 ='+hasil1);
                                alert('hasi2 ='+hasil2);
                                alert('hasi3 ='+hasil3);
                </script>
                <body>
                                <div id="demo"></div>
                                <div id="demo1"></div>
                                <div id="demo2"></div>
                                <div id="demo3"></div>
                                <script>
                               
                               
                                                var getCuy = "Ini get nya y dan nilai = ";
                                                var nilai = 3
                                               
                                               
                                                document.getElementById("demo").innerHTML=getCuy+nilai;
                                               
                                                getCuy1 = "Ini get nya y1";
                                                document.getElementById("demo1").innerHTML=getCuy1;
                                               
                                                nilai3 = prompt('nilai');
                                                getCuy3 = nilai3 + 10;
                                               
                                                document.getElementById("demo3").innerHTML='getCuy3 = '+getCuy3;
                                               
                                                demo2js = 2;
                                                document.getElementById("demo2").innerHTML = demo2js;
                                               
                                               
                                               
                                </script>
                </body>
</html>
4.Konversi
<!DOCTYPE>
<html>
                <head>
                                <title>
                                </title>
                </head>
                <script>
                                var nilai = 10;
                                nilai += 3;
                                nilai1 = nilai + 10;
                                alert(nilai);
                                alert(nilai1);
                                nilai2= prompt('masukan nilai =');
                </script>
                <body>
                                <div id="demo"></div>
                               
                                <script>
                                hasil= parseInt(nilai2) + 10;
                               
                                document.getElementById('demo').innerHTML = hasil;
                                               
                                </script>
                </body>
</html>
Konversi1
<!DOCTYPE>
<html>
                <head>
                                <title>
                                </title>
                </head>
                <script>
                                var nilai = '5.7';
                                hasil = parseInt(nilai);
                                hasil1 = parseFloat(nilai);
                                hasil2 = hasil+hasil1;
                                alert(hasil);
                                alert(hasil1);
                </script>
                <body>
                                <div id="demo"></div>
                               
                                <script>
                               
                               
                                document.getElementById('demo').innerHTML = 'jumlah ='+hasil2;
                                               
                                </script>
                </body>
</html>
Konversi 2
<!DOCTYPE>
<html>
                <head>
                                <title>
                                </title>
                </head>
                <script>
                                var nilai = '5.7';
                                hasil = parseInt(nilai);
                                hasil1 = parseFloat(nilai);
                                hasil2 = hasil+hasil1;
                                document.write('ini document. write '+hasil+'<br />');
                                document.write('ini document. write '+hasil1+'<br />'                );
                                document.write('ini document. write '+hasil2);
                               
                </script>
                <body>
                                <div id="demo"></div>
                               
                                <script>
                               
                               
                                document.getElementById('demo').innerHTML = 'tulisan dalam div jumlah ='+hasil2;
                                               
                                </script>
                </body>
</html>
5. array
<!DOCTYPE>
<html>
                <head>
                                <title>
                                </title>
                </head>
                <body>
                                <script>
                                var nama;
                                nama = new Array();
                                //assign
                                nama[0]='febrian';
                                nama[1]='rizkiono';
                                //menampilkan nilai dari array dengan mengakses index
                                document.write('nama saya adalah = '+nama[0]+'<br>');
                                document.write('nama saya adalah = '+nama[1]+'<br>');
                                </script>
                </body>
</html>
6. if
<!DOCTYPE>
<html>
                <head>
                                <title>
                                </title>
                </head>
                <script type="text/javascript">
                                var nilai = 65;
                                var hasil;
                                if(nilai>90)
                                {
                                                hasil="A";
                                }
                                else if(nilai>80 || nilai<=89)
                                {
                                                hasil = "B";
                                }
                                else if(nilai>65)
                                {
                                                hasil = "C";
                                }
                                else
                                {
                                                hasil = "D";
                                }
                               
                                document.write("hasil = "+hasil);
                </script>
                <body>
                               
                </body>
</html>
7.switch
<!DOCTYPE html>
<html>
<head>
                <title>
                </title>
</head>
                <script type="text/javascript">
                                var nilai;
                                nilai = prompt("masukan nilai=");
                                switch(parseInt(nilai))
                                {
                                                case 1 : document.write("nilai = 1");
                                                                                 break;
                                                case 2 : document.write("nilai = 2");
                                                                                 break;
                                                case 3 : document.write("nilai = 3");
                                                                                 break;
                                                case 4 : document.write("nilai = 4");
                                                                                 break;
                                                case 5 : document.write("nilai = 5");
                                                                                 break;
                                                default : document.write("nilai yg anda masukan diluar 1 sampai 5");
                                                                                 break;
                                }
                </script>
<body> 
</body>
</html>
8.event

<!DOCTYPE html>
<html>
<head>
                <title>
                </title>
</head>
                <script type="text/javascript">
                                function tampil(){
                                                alert('saya tampil');
                                }
                               
                                function ubahStatus(){
                               
                                                alert('status berubah');
                                }
                                function cari(){
                                                alert('keypress');
                                }
                                function cari_keyup(){
                                                alert('cari_keyup');
                                }
                               
                                function validasi(){
                               
                                var nama = document.pendaftaran.nama.value;
                                if(nama==''){
                                                alert('masukan nama');
                                }else{
                                                alert(nama);
                                }
                               
                                }
                               
                </script>
<body> 
                <button type="button" onclick="tampil()">klik saya</button>
               
                <select name="sample" onchange="ubahStatus()">
                                <option value="">belum dikirim</option>
                                <option value="">sudah dikirm</option>
                </select>
               
                <input type="text" placeholder="kata onkeypress" onkeypress="cari()">
                <input type="text" placeholder="kata onkeyup" onkeyup="cari_keyup()">
               
                <form name="pendaftaran">
                                <input type="text" name="nama" placeholder="masukan nama">
                                <button type="submit" onclick="validasi()">Kirim</button>
               
                </form>
               
               
</body>
</html>

0 Response to "javascript basic"

Posting Komentar