Tugas Desain Web Kelas A – A Tanggal 26 Maret 2013 | Catatan Kecil

PENGANTAR JAVASCRIPT.
Sekilas Te ta g Ja as ript
Ja as ipt adalah ahasa pe

og a a

a g popula . Ja as ipt adalah ahasa pe

og a a

digu aka u tuk HTML da WEB, u tuk “e e , PC, Laptop, ta let da le ih a ak lagi. Kode pe
ja as ipt dapat disisipka kedala
o se

Nets ape Na igato

Me gi gat pada

e gga i

a kei le di a di gka

u gki

. Na u

aktu itu

a a a

uka

e

a a a

e jadi Ja a“ ipt,

Ja a“ ipt,

o se


uata

Mi osot

ulai

e

e lo

ei

a-lo

a a ahasa
a

e ge

o se Nets ape, tapi idak de


isa

di

Li e“ ipt.

aka pihak Nets ape
a a te se ut le ih
ulai ikut-ikuta

e duku g Ja a“ ipt. Na u

a g lai ,

a gka

e lai a . Oleh se a pe sai ga itulah te kada g suatu Ja a“ ipt

a u


i al Nets ape pu

a, I te et E plo e , supa a

ka e a ge gsi, pihak Mi osot

itu, Nets ape da

a g sepe i a

Li e“ ipt. “ela jut a pihak Mi osot

og a a

ulai dipe ke alka

aktu itu tek ologi Ja a seda g pa as-pa as a atau seda g t e ,

e utuska u tuk

e fasilitasi

hala a HTML. Pada a al a, Ja a“ ipt

a g

aitu Js ipt. Mulai saat

ahasa te se ut dala

u gki

e si a g

isa eke ja de ga

aik di

ikia hal a di IE, egitu pula se alik a.


Bagai a a Me ulis Ja as ript
Ada dua je is agai a a ja as ipt di uat, pe ta a ja as ipt ditulis dala
HTML, kedua ja as ipt ditulis dala
de ga ekte si ile .js. Dala

HTML. Ja as ipt a g ditulis dilua HTML dise ut Ekste al Ja as ipt

HTML, pe ulisa s ipt dia ali de ga … . “ ipt a g aka

dijala ka ha us diletakka dia ta a da . Tag

e iliki e e apa at i ut, a u

a g te pe i g adalah at i ut la guage da t pe. Ka e a Ja as ipt
s ipi g,

aka sa gatlah pe lu u tuk

digu aka


adalah Ja as ipt da

Ja as ipt

u tuk

ile a g te pisah de ga

e

e itahuka

sela jut a

o se

kepada
aka

o se


uka

satu-satu a

ah a

e jala ka

ahasa s ipt
odul



“ ipt dapat diletakka di tag < od > da atau di tag pada agia hala a HTML.
Contoh 1

alert(“Belajar Javascript”);



Pe ga ta Ja as ipt

a g

pe duku g

e p oses a. “ehi gga u tuk Ja as ipt, pada tag pe lulah dita

at i ut e ikut i i:

ahasa

ahka

Pada o toh

e ikut, s ipt di tulis pada aga < od >

Contoh 2




...

document.write(“ Belajar Javascript”);

...



Pe ulisa Fu gsi pada Ja as ript
Pe ulisa ja as ript di dala
Dala

tag

o toh e ikut, s ipt ja a diletakka di tag pada hala a HTML. Fu gsi aka dipa ggil

keika to


ol diklik.

Co toh




function cobafungsi()
{
document.getElementById("coba").innerHTML="Belajar membuat fungsi";
}



Halaman WEB
A Paragraph
Coba Fungsi



Pe ulisa ja as ript di dala
Dala

tag < ody>

o toh e ikut, fu gsi ja as ipt diletakka di tag < od > pada hala a HTML. Fu gsi aka dipa ggil

keika to

ol diklik.

Co toh



Halaman Web
A Paragraph
Coba

Function cobafungsi()
{

Pe ga ta Ja as ipt

document.getElementById("coba").innerHTML="Belajar Fungsi Javascript";
}




Me

eri Ko e tar pada Ja as ript.

Ko e ta pada suatu s ipt idak aka dieksekusi oleh Ja as ipt. Ko e ta dita ahka pada s ipt u tuk
e e ika pe jelasa s ipt atau e uat sk ip idak dieksekusi. U tuk e e ika ko e ta a g
ha a satu a is gu aka //.
Be ikut o toh agai a a

e

e i ko e ta si gle.

Contoh 5
// Write to a heading:
document.getElementById("myH1").innerHTML="Selamat datang di Homepage Saya";
// Write to a paragraph:
document.getElementById("myP").innerHTML="Ini adalah paragraph saya.";
Contoh 6
var x=5;
var y=x+2;

// mendeklarasikan x dan memasangkannya dengan 5
// mendeklarasikan y dan memasangkannya dengan x+2

U tuk e e ika ko e ta le ih da i satu a is, gu aka /* da */. Jadi s ipt a g te letak di a ta a /*
da */ aka dia ggap se agai ko e ta . Be ikut o toh e e i ko e ta a g le ih da i satu a is.
Co toh
/*
Kode berikut akan ditulis ke heading dan paragraph.
Dan akan menampilkan halaman homepage
*/
document.getElementById("myH1").innerHTML="Selamat datang di Homepage Saya";
document.getElementById("myP").innerHTML=" Ini adalah paragraph saya.";

Pe ga ta Ja as ipt

TIPE DATA DAN VARIABEL
Tipe Data da Varia el pada Ja as ript
Lazi

a ahasa pe

sepe i kotak atau

og a a , ja as ipt

adah a g digu aka

e iliki ipe data da

u tuk

e i pa

i fo

a ia el. Va ia el pada ja as ipt
asi a g se a iasa dapat diload.

“eda gka ipe data te kait de ga je is data atau ilai a g disi pa dala

a ia el.

Deklarasi Varia el
Dala
adalah

ja as ipt, seiap kali aka

e dekla asika ke e adaa

a a a ia el, o pute aka
a ia el te se ut. U tuk

e ggu aka

a a a ia el. Hal i i pe lu dilakuka ka e a de ga ada a dekla asi

e ediaka

e e apa agia

e dekla asika

a ia el ada e e apa atu a

a ia el, la gkah pe ta a a g ha us dilakuka
e o i u tuk

a ia el digu aka

e i pa

kata ar. Dala

ilai pada a a

e dekla asika

a a

a g ha us dipe haika , aitu :

. Na a a ia el ha us di ulai de ga hu uf
. Na a a ia el juga dapat di ulai de ga $ da _
. Na a a ia el adalah asesensiive
. Ja ga

esa ke il a hu uf .

e ggu aka Reserved Word atau kata te ada g se agai a a a ia el. Kata te ada g adalah

kata a g sudah uilt in dala
aka

e pe haika

ja as ipt a g sudah e

ak a khusus. Pe ggu aa kata te ada g i i

e gaki atka error.

Contoh 1
var namakota;
namakota=“Malang”;
Contoh 2
var namakota=“Malang”;
Contoh 3
var namakota=“malang”, propinsi=“Jawa Timur”, kode=”3”, x=6.23;

Pada o toh di atas, didekla asika
a akota adalah null koso g . Ke udia

a ia el a akota. Pada a al pe dekla asia , ilai da i a ia el
a ia el a akota di e i ilai Mala g. U tu

pada suatu a ia el digu aka ta da peik dua
e dekla asika

a ia el a akota a g sekaligus

Pe ga ta Ja as ipt

e

e ika

ilai

apa ila ipe data a e upa st i g. Pada o toh
e

e i ilai pada a ia el a akota. Co toh

di atas

e dekla asika
ko a , u tuk

e e apa a ia el sekaligus. U tuk
e isahka

a ia el satu de ga

e dekla asika

a g lai

e e apa a ia el digu aka ta da

a.

Tipe Data
Tipe data pada ja as ipt
adalah data a g

e uat ka akte ,

peik, aik peik ga da
u e ik. Dala
dala

elipui : “t i g, I tege , Float, A a , O je t da Boolea s. Tipe data st i g
isal a Mala g . “t i g adalah se a a g te t a g ada di dala

aupu peik tu ggal

. Tipe data i tege da loat

e dekla asika ipe data o je t digu aka ta da ku u g ku a al

ipe data o je t dipisahka de ga

ta da

e upaka ipe data


. “eiap p ope t

e ggu aka ta da ko a , . Tipe data Boolea s te di i da i dua

ilai, aitu t ue atau false. Be ikut e e apa o toh pe ggu aa ipe data pada ja as ipt.
Contoh 4
var namakota=“Malang”;
var propinsi=’Jawa Timur’;
var x1=34;
var x2=3.14;
var y=123e4;
var x=true;

//
//
//
//
//
//

tipe
tipe
tipe
tipe
tipe
tipe

data
data
data
data
data
data

string
string
integer
float
integer
boolean

Contoh 5
//berikut beberapa cara mendeklarasikan Array
var mobil=new Array();
mobil[0]=”Toyota”;
mobil[1]=”Daihatsu”;
mobil[2]=”Honda”;
var bulan=new Array(“Januari”,”Febuari”,”Maret”,”April”);
var kampus=[“UM”,”UNMUH”,”KANJURUHAN”,”UIN MAULANA MALIK”,”ITN”];
Contoh 6
var klien={nama:”Pamungkas”, sex:”Laki-Laki”, id:”5758”};

Pada o toh di atas didekla asika
didekla asika

a ia el de ga

e e apa a ia el de ga

ipe data st i g, i tege , loat da

e dekla asika ipe data je is a a , da

Boolea . Co toh

e e apa a a a iasi pe ulisa

de ga ipe data o je t di o tohka pada o toh .

Pe ga ta Ja as ipt

e agai ipe data. Pada o toh
a. Pe dekla asia

di atas
di atas
a ia el

OPERATOR PADA JAVASCRIPT
Operator Arit aika
Ope ato a it aika digu aka u tuk
Misal di e ika

= , ta el e ikut

Ope ato

e jelaska te ta g ope ato a it aika.

Desk ipsi

Co toh

+

Pe ju laha

= +

-

Pe gu a ga

= –

*

Pe kalia

= *

/

Pe

= /

%

Modulus “isa agi

= %

I

=++

++

e e t

De e e t

Nilai

.

=-= --

Operator Pe

eria Nilai

Ope ato pe
=

agia

Nilai

= ++

--

di e ika

elakuka ope asi a it aika a ta a a ia el da atau ilai.

e ia

, da

ilai digu aka u tuk

= . Ta el e ikut

Ope ato

Co toh

e

e ika

ilai pada a ia el. Dala

e jelaska ope ato pe

e ia

“a a de ga

ilai.
hasil

=

=

+=

+=

= +

=

-=

-=

= –

=

*=

*=

= *

=

/=

/=

= /

=

%=

%=

= %

=

Pe ga ta Ja as ipt

=

o toh e ikut,

Operator + ya g digu aka pada ipe data Stri g
Ope ato + juga dapat digu aka u tuk

e a

ahka

a ia el e ipe data st i g atau ilai te t.

Contoh 1
//untuk menambahkan dua atau lebih variabel tipe String, gunakan operator +
txt1="Selamat Datang";
txt2="Di Jurusan Matematika";
txt3=txt1+” “+txt2;
Hasil dari script di atas adalah :
Selamat Datang Di Jurusan Matematika
Contoh 2
//menambahkan String dan Bilangan
x=5+5;
y="5"+5;
z="angka "+5;
Hasil dari script di atas adalah :
10
55
angka 5

Operator Pe

a di g

Ope ato pe

a di g digu aka

pe edaa dia ta a ilai- ilai. Di e ika
Ope ato
==
===

dala

pe

ataa

ilai X = , ta el di a ah i i

Desk ipsi

!=

Tidak sa a de ga

!==

Tidak sa a de ga

ilai da ipe data

ilai atau ipe data

e e tuka

kesa aa

e jelaska ope ato pe

Pe

“a a de ga
“a a pe sis de ga

logika u tuk

a di g

Balika

X==

False

X==

T ue

X===

False

X===

T ue

X!=

T ue

X!==

T ue

X!==

False

>

Le ih esa da i

X>

False

<

Le ih ke il da i

X<

T ue

Le ih esa sa a de ga

X>=

False

Le ih ke il sa a de ga

X

T ue

||

Atau

X == || Y ==

False

!

Negasi/I gka a

! ==

T ue

Operator Bersyarat
Ja as ipt juga

e uat ope ato

e s a at a g

e

e ika suatu ilai ke suatu a ia el e dasa ka

ko disi a g sa a.
“ ta

a:

NamaVariabel=(syarat)?nilai 1: nilai 2

Co toh :



Klik tombol untuk memeriksa usia
Usia:
Apakah Usianya mencukupi?
Coba Cek Usia


function myFunction()
{
var usia,periksa;
usia=document.getElementById("usia").value;
periksa=(usia