Java Script

1
Java Script
2
JavaScript

• JavaScript je skript jezik kojim Web dizajneri
  mogu da automatizuju postupke unutar Web stranice
• Skript jezik - jer omogucava pisanje skripta
  (niza naredbi) koje ce Web citac izvršiti
• Ne koristi se za pravljenje spoljnog programa
  koji se izvršava nezavisno od citaca

3
JavaScript

• JavaScript se ugraduje u HTML Web stranice nije
  potreban poseban alat može se koristiti isti
  program za uredenje teksta koji se koristi za
  izradu Web stranice
• Najpopularniji citaci Weba imaju ugradenu podršku
  za JavaScript posetioci lokacije ne moraju
  instalirati dodatne programe na svoje racunare
• JavaScript iskazi postavljaju se izmedu oznaka
  ltscriptgt i lt/scriptgt, koje ce ukazati citacu Weba
  da izvrši JavaScript iskaze umesto da prikaže
  tekst na ekranu

4
Pozicije oznaka
Skriptovi u zaglavlju dokumenta
Skriptovi u telu dokumenta
lthtmlgt ltheadgt lttitlegt Dokumentlt/titlegt ltscript type"text/javascript"gt //naredbe lt/scriptgt lt/headgt ltbodygt lt/bodygt lt/htmlgt
lthtmlgt ltheadgt lttitlegt Dokumentlt/titlegt lt/headgt ltbodygt ltscript type"text/javascript"gt //naredbe lt/scriptgt lt/bodygt lt/htmlgt
5
Pozicije oznaka
Skriptovi u zaglavlju i telu dokumenta
Dva skripta u telu dokumenta
lthtmlgt ltheadgtlttitlegt Dokumentlt/titlegt ltscript type"text/javascript"gt //naredbe lt/scriptgt lt/headgt ltbodygt ltscript type"text/javascript"gt //naredbe lt/scriptgt lt/bodygt lt/htmlgt
lthtmlgt ltheadgtlttitlegt Dokumentlt/titlegt lt/headgt ltbodygt ltscript type"text/javascript"gt //naredbe lt/scriptgt ltmore htmlgt ltscript type"text/javascript"gt //naredbe lt/scriptgt lt/bodygt lt/htmlgt
6
JavaScript

• Iskazi skripta mogu se uokviriti HTML oznakama za
  komentar (lt!--komentar--gt) kako bi se sprecilo
  da citaci koji ne podržavaju JavaScript na ekranu
  prikažu iskaze skripta
• Citaci koji ne podržavaju JavaScript ignorisace
  oznake skripta i sve što se nalazi izmedu pocetne
  i završne oznake komentara
• Obrnuto, citaci koji podržavaju JavaScript
  ignorisace oznake komentara i izvršiti funkciju
  skripta

7
Postupanje sa starijim citacima koji ne
podržavaju skriptove

• Kada se u HTML dokument uvrsti skript nije
  osigurano da citac Weba posetioca podržava
  izvršenje skripta
• Da bi se posetilac upozorio o tome da HTML
  dokument sadrži skript koji njegov citac ne može
  da izvrši, mogu se koristiti oznake ltnoscriptgt
  lt/noscriptgt
• Najbolje mesto za postavljanje oznake ltnoscriptgt
  je odmah iza oznake lt/scriptgt
• Izmedu oznaka ltnoscriptgt lt/noscriptgt treba uneti
  tekst koji ce citac Weba prikazivati ako ne
  podržava skriptove

8
Primer 1.

• lthtmlgt
• ltheadgt lttitlegt Primer izvršavanja JavaScripta
  lt/titlegt lt/headgt
• ltbodygt
• ltpgt Tekst koji se ispisuje pre izvršavanja
  iskaza.lt/pgt
• ltscript type"text/javascript"gt
• lt!--
• alert('Ovo je dijalog ALERT!')
• //--gt
• lt/scriptgt
• ltnoscriptgt No JavaScript support, ... SORRY!
  lt/noscriptgt
• ltpgt Tekst koji se ispisuje nakon izvršavanja
  iskaza.lt/pgt
• lt/bodygt
• lt/htmlgt
• Snimite dokument pod nazivom Primer1.html na D
  disk (D\Grupa I\JavaScript\Primer1.html)

Naredba (iskaz)
9
Korišcenje objektnog modela

• JavaScript vidi Web stranicu kao skup svojstava
  i objekata smeštenih u objekat pod nazivom
  document
• Svojstva koja citac Weba smešta u objekat
  document ukljucuju prednji plan (tekst),
  pozadinu, boje hiperteksta Web stranice, elemente
  obrasca, slike, itd.
• Menjajuci vrednosti svojstava tog objekta može se
  promeniti i izgled Web stranice i objekti na
  stranici
• Na primer, mogu se postaviti svojstva
• document.bgColor promena boje pozadine
• document.fgColor promena boje slova
• document.linkColor promena boje hiperveze
  neposecenih stranica
• document.vlinkColor - promena boje hiperveze
  posecenih stranica, itd

Svojstvo
Objekat
10
Primer 2.

• lthtmlgt
• ltheadgt lttitlegt Primer izvršavanja JavaScripta
  lt/titlegt lt/headgt
• ltbodygt
• ltpgt Tekst koji se ispisuje pre izvršavanja
  iskaza.lt/pgt
• ltscript type"text/javascript"gt
• lt!--
• alert('Ovo je dijalog ALERT!')
• document.bgColor"lightyellow"
• document.fgColor"magenta"
• //--gt
• lt/scriptgt
• ltpgt Tekst koji se ispisuje nakon izvršavanja
  iskaza.lt/pgt
• lt/bodygt
• lt/htmlgt
• Snimite dokument pod nazivom Primer2.html na D
  disk (D\Grupa I\JavaScript\Primer2.html)

11
Primer 2a.

• Modifikujte prethodno realizovan Primer 2.,
  premeštanjem iskaza
• alert('Ovo je dijalog ALERT!')
• iza iskaza
• document.fgColor"magenta"

12
Primer 2a.

• lthtmlgt
• ltheadgt lttitlegt Primer izvršavanja JavaScripta
  lt/titlegt lt/headgt
• ltbodygt
• ltpgt Tekst koji se ispisuje pre izvršavanja iskaza
  JavaScript-a.lt/pgt
• ltscript type"text/javascript"gt
• lt!--
• document.bgColor"lightyellow"
• document.fgColor"magenta"
• alert('Ovo je dijalog ALERT!')
• //--gt
• lt/scriptgt
• ltpgt Tekst koji se ispisuje nakon izvršavanja
  iskaza JavaScript-a.lt/pgt
• lt/bodygt
• lt/htmlgt
• Snimite dokument pod nazivom Primer2a.html na D
  disk (D\Grupa I\JavaScript\Primer2a.html)

13
Rezervisane reci JavaScripta

• Prilikom imenovanja funkcija ili definicija
  promenljive za smeštanje informacija dok citac
  izvršava iskaze u funkciji ili skriptu moraju
  se izabrati imena funkcija i promenljivih koje
  nisu u sukobu sa rezervisanim recima JavaScripta

abstract continue finally instanceof protected throws
boolean default float int public transient
break delete for interface return true
byte do function long short try
case double goto native static typeof
catch else if new super switch var
char extends implements null synchronized void
class false import package this while
const final in private throw with
14
Korišcenje komentara

• Komentar se u Java iskaze postavlja umetanjem dve
  kose crte (//) za jednoredne komentare
• // Ovo je komentar
• JavaScript podržava i blok komentare koji pocinju
  kosom crtom i zvezdicom (/) a završavaju se sa
  zvezdicom i kosom crtom (/)
• /
• Citac ce ignorisati kompletan tekst na koji
  naide nakon kose crte i zvezdice kojima pocinje
  blok komentar dok ne ucita zvezdicu i kosu crtu
  kojima se završava višeredni blok komentar.
• /

15
Deklarisanje promenljivih u JavaScriptu

• U JavaScript iskazima informacije se cuvaju u
  promenljivama
• Za razliku od vecine prgramskih jezika nije
  potrebno zadati tip informacije koji se smešta u
  promenljivu kada se ona deklariše
• JavaScript odreduje tip promenljive na osnovu
  podatka koji se smešta u promenljivu
• Tip podatka promenljive može se promeniti zavisno
  od operacije u kojoj se koristi promenljiva

16
Deklarisanje promenljivih u JavaScriptu

• Sama deklaracija promenljive u skriptu zadaje se
  imenom nakon kljucne reci var
• var BookTitle, ChapterNumber
• var Publisher
• Ako se promenljivoj daje pocetna vrednost iza
  njenog imena postavlja se operator dodele () i
  pocetna vrednost
• var StringValue 10
• var IntValue 20

17
Ogranicenja pri deklaraciji promenljivih

• Ime promenljive ne sme se sukobiti sa
  rezervisanom reci JavaScripta
• Imena promenljivih moraju pocinjati slovom ili
  donjom crtom (_) i mogu sadržati brojeve ili
  slova nakon prvog znaka
• Imena promenljivih ne mogu sadržati znakove za
  razmak ili interpunkciju
• U nazivima i rezervisanim recima JavaScripta (kao
  var) treba voditi racuna o velicini slova (eng.
  Case-sensitive)
• var je rezervisana rec, a Var nije
• Promenljiva stringvalue je razlicita od
  StringValue

18
JavaScript operatori

• Operatori dozvoljavaju kombinovanje promenljivih
  i/ili slovnih vrednosti u izraze koji daju
  vrednosti
• Ti izrazi se mogu prikazivati, smeštati u
  promenljive ili koristiti kao delovi drugih
  izraza
• JavaScript operatori mogu se grupisati u nekoliko
  klasa na osnovu njihove namene
• aritmeticki operatori zahtevaju dve
  promenljive, dve vrednosti ili dva izraza (po
  jedan na svakoj strani operatora)
• unarni JavaScript operatori odnose se na jedan
  operand
• operatori poredenja omogucavaju poredenje
  jednog izraza, promenljive ili slovne vrednosti s
  nekom drugom
• logicki operatori omogucavaju poredenje dve
  logicke vrednosti

19
Aritmeticki operatori
Operator Namena Primer
Sabiranje Izrazizraz
- Oduzimanje Izraz-izraz
Množenje Izrazizraz
/ Deljenje Izraz/izraz
Deljenje po modulu (vraca ostatak pri deljenju) Izraz izraz
20
Unarni JavaScript operatori
Operator Namena Primer
Povecanje za 1 promenljiva ili promenljiva
-- Smanjenje za 1 Promenljiva-- ili --promenljiva
- Promena znaka -izraz
! Komplement (operator negacije) !izraz

• Kada se dvostruki plus () ili dvostruki minus
  (--) stavi ispred promenljive, kao prefiks,
  operacija se obavlja pre dodele vrednosti
• Ako se operator postavi kao sufiks, nakon
  promenljive, operacija se obavlja nakon dodele
  vrednosti.
• Na primer
• i 10
• j --i //i9,. j9
• j i //j10, i11

21
Operatori poredenja
Operator Namena Primer
lt Manje od izrazltizraz
gt Vece od izrazgtizraz
lt Manje ili jednako izrazltizraz
gt Vece ili jednako izrazgtizraz
Jednako izrazizraz
! Razlicito od izraz!izraz
? Uslovni (if-else) operator (logicki izraz) ? izraz TRUE else FALSE
22
Logicki operatori
Operator Namena Primer
Logicko I Izrazizraz
Logicko ILI Izrazizraz

• Logicki operatori obicno se koriste za poredenje
  rezultata dva izraza u uslovnom iskazu ili u
  upravljackoj petlji

23
JavaScript funkcije

• Srodne naredbe (iskazi) grupišu se u funkciju
• U okviru Web stranice svaka JavaScript funkcija
  mora imati jedinstveno ime
• Definicija pocinje kljucnom recju function, zatim
  sledi ime funkcije i neobavezni niz parametara
  (obuhvacenih zagradama)
• Nakon imena funkcije i neobaveznog niza
  parametara, izmedu viticastih zagrada navode
  se JavaScript iskazi koji izvode zadatak funkcije

24
JavaScript funkcije

• function greetVisitor()
• alert(Welcome to My Site)
• return
• Iskazi JavaScripta završavaju se tackom i zarezom
  ()
• Na kraju funkcije (pre zatvaranja desne viticaste
  zagrade) umece se kljucna rec return - vraca
  upravljanje citaca Weba iskazu koji je pozvao
  funkciju
• Funkcije je najbolje ugraditi na kraj zaglavlja
  (neposredno ispred oznake lt/headgt) - osigurava da
  ce citac Weba ucitati telo funkcije pre nego što
  posetilac izazove dogadaj s kojim je funkcija
  povezana

25
Primer 3.

• lthtmlgt
• ltheadgt lttitlegt Funkcije JavaScripta lt/titlegt
• ltscript type"text/javascript"gt
• lt!--
• function greetVisitor()
• alert("Welcome to My Site")
• return
• // --gt
• lt/scriptgt
• lt/headgt
• ltbodygt
• ltpgt Tekst koji se ispisuje pre izvršavanja
  iskaza JavaScript-a.lt/pgt
• ltscript type"text/javascript"gt
• lt!--
• greetVisitor()
• // --gt
• lt/scriptgt

26
Prosledivanje vrednosti u JavaScript funkciju i
iz nje

• Kada se pozove JavaScript funkcija moguce je
  proslediti vrednosti u funkciju preko
  promenljivih koje se zovu parametri
• Niz parametara funkcije nalazi se u zagradama,
  posle imena u deklaraciji funkcije
• Sledeci kod deklariše funkciju sa tri parametra
  first, next i last
• function FindTotal(first,next,last)
• var total first next last
• document.write (Rezultat je total .
  )
• return
• Tekst i naredbe HTML-a se stavljaju unutar
  navodnika.
• Naredbom document.write(...) unutar Java Scripta
  se u dokument ispisuje HTML kod ili korisnicki
  tekst.
• Java Script i HTML iskazi medusobno se povezuju
  znakom plus ().

27
Primer 4a.

• lthtmlgt
• ltheadgt
• lttitlegt Funkcija zbira lt/titlegt
• ltscript type"text/javascript"gt
• lt!--
• function FindTotal(first,next,last)
• var total first next last
• document.write (Rezultat je total .
  )
• return
• // --gt
• lt/scriptgt
• lt/headgt
• ltbodygt
• ltscript type"text/javascript"gt
• lt!--
• FindTotal(2,3,4)
• // --gt
• lt/scriptgt

28
Primer 4b.

• lthtmlgt
• ltheadgt
• lttitlegt Funkcija zbira lt/titlegt
• ltscript type"text/javascript"gt
• lt!--
• function FindTotal(first,next,last)
• var total first next last
• document.write ("Unete vrednosti su ltbrgt"
  first "ltbrgt" next "ltbrgt" last "ltbrgt
  ltbgtNjihov zbir jelt/bgt" total " . )
• // --gt
• lt/scriptgt
• lt/headgt
• ltbodygt
• ltscript type"text/javascript"gt
• lt!--
• FindTotal(2,3,4)
• // --gt
• lt/scriptgt

29
Primer 4c.

• Napraviti Web stranu koja prikazuje tri vrednosti
  i njihov proizvod, kao što je prikazano na slici.
  Realizovani primer sacuvati pod nazivom Primer
  4c.

30
Primer 4c.

• lthtmlgt ltheadgt lttitlegt Funkcija proizvoda lt/titlegt
• ltscript type"text/javascript"gt
• lt!--
• function FindTotal(first,next,last)
• var total first next last
• document.write ( Unete vrednosti su ltbrgt ltigt
  Prva vrednost lt/igt first ltbrgt ltigt Druga
  vrednostlt/igt next ltbrgt ltigt Treca vrednost
  lt/igt last ltbrgtlthrgt ltbgt Njihov proizvod
  jelt/bgt total . )
• // --gt
• lt/scriptgt lt/headgt
• ltbodygt
• ltscript type"text/javascript"gt
• lt!--
• FindTotal(5,3,2)
• // --gt
• lt/scriptgt
• lt/bodygt lt/htmlgt
• Snimite dokument pod nazivom Primer4c.html na D
  disk (D\Grupa I\JavaScript\Primer4c.html)

31
Uslovni iskazi i petlje

• Skriptovi koji donose odluke obavljaju uslovnu
  obradu
• Zavisno od rezultata jednog ili više uslova,
  citac ce izvršiti odredene iskaze
• Da bi doneli odluku skriptovi moraju izvršiti
  neku vrstu provere koriste operatore poredenja
• Rezultat poredenja dve vrednosti relacionim
  operatorima je logickog tipa ili true (tacno)
  ili false (netacno)

32
Uslovno izvršavanje

• Iskaz if omogucava skriptovima da izvrše provere,
  a potom izvrše iskaze zavisno od rezultata
  provere
• Ako je rezultat poredenja tacan, skript izvršava
  iskaz koji sledi iza iskaza if
• S druge strane, ako je rezultat provere
  pogrešan, skript preskace iskaz koji sledi
• Format iskaza if je sledeci
• if (uslov je ispunjen)
• iskaz

33
Uslovno izvršavanje

• Uslov if može da se koristi za izvršavanje jednog
  ili više iskaza
• Kada skript izvršava samo jedan iskaz koji dolazi
  iza if, to je prost iskaz
• if (Age gt 18)
• alert(Register to vote at www.VoterRegistration.c
  om)
• Za skriptove koji treba da izvrše nekoliko iskaza
  kada uslov bude ispunjen, iskazi se moraju
  grupisati izmedu leve i desne viticaste zagrade
  (). Iskazi koji se nalaze u zagradama
  sacinjavaju složen iskaz
• if (time gt 10)
• document.write("ltbgtGood daylt/bgt")
• document.bgColor"lightyellow"

34
Predefinisani objekti

• JavaScript poseduje izvestan skup predefinisanih
  objekata Date, Array, Math.
• Razmotricemo ih na primeru objekta Date.
• Novi objekat se kreira upotrebom operatora new
•  var danas new Date()
• Date poseduje metode koji se mogu koristiti pri
  manipulaciji objektom
• getHours() -  za dobijanje casova
• getMinutes()-  za dobijanje minuta
• getMonth() -  za dobijanje meseca
•   var sada new Date()document.write("Vreme
  je" sada.getHours() "" sada.getMinutes() 
  "ltbrgt) 

35
Primer 5.

• lthtmlgt
• ltheadgt
• lttitlegt Primer uslovnog izvršavanja lt/titlegt
• lt/headgt
• ltbodygt
• ltscript type"text/javascript"gt
• lt!--
• var d new Date()
• var time d.getHours()
• var sada new Date()
• document.write("Vreme je" sada.getHours()
  ""  sada.getMinutes() "ltbrgt)
• if (time gt 10)
• document.write("ltbgtGood daylt/bgt")
• // --gt
• lt/scriptgt
• lt/bodygt
• lt/htmlgt

36
Uslovno izvršavanje

• Vecinom skriptovi zadaju jedan skup iskaza koji
  se izvršava kada je uslov ispunjen i drugi skup
  ako uslov nije ispunjen
• Definisanje iskaza koji se izvršavaju kada uslov
  nije ispunjen realizuje se iskazom else
• Format iskaza else je sledeci
• if (uslov je ispunjen)
• iskaz
• else
• iskaz

37
Primer 6.

• lthtmlgtltheadgt
• lttitlegt Primer uslovnog izvršavanja lt/titlegt
• lt/headgt
• ltbodygt
• ltscript type"text/javascript"gt
• var d new Date()
• var time d.getHours()
• var sada new Date()
• document.write("Vreme je" sada.getHours()
  ""  sada.getMinutes() "ltbrgt)
• if (time lt 10)
• document.write("ltbgtGood morninglt/bgt")
• else
• document.write("ltbgtGood daylt/bgt")
• lt/scriptgt
• lt/bodygt

38
Petlje ponavljanja

• Petlje ponavljanje oznacavaju ponavljanje niza
  koraka dok se ne postigne uslov koji ce dozvoliti
  da se iz petlje izade
• Najcešca konstrukcija povratne petlje koja se
  koristi u JavaSriptu
• for (pocetni izraz uslov obnavljajuci izraz)
• naredbe unutar petlje

39
Petlje ponavljanja

• Na primer
• for (Count 1 Count lt5 Count)
• Iskaz
• Iskaz Count1 dodeljuje kontrolnoj promenljivoj
  pocetnu vrednost
• Petlja for izvodi ovu inicijalizaciju samo
  jednom, kada se pokrene
• Zatim proverava uslov Countlt5
• Ako je uslov ispunjen petlja for ce izvršiti
  iskaz koji sledi
• Ako uslov nije ispunjen, petlja ce se završiti i
  skript ce nastaviti sa izvršavanjem od prvog
  iskaza koji sledi nakon petlje
• Ako je uslov ispunjen i petlja for izvršava iskaz
  povecace promenljivu Count korišcenjem iskaza
  Count

40
Primer 7.

• lthtmlgt
• ltheadgt
• lttitlegt For petlja lt/titlegt
• lt/headgt
• ltbodygt
• ltscript type"text/javascript"gt
• lt!--
• for (i 0 i lt 5 i)
• document.write("The number is " i)
• document.write("ltbrgt")
• // --gt
• lt/scriptgt
• lt/bodygt
• lt/htmlgt
• Snimite dokument pod nazivom Primer7.html na D
  disk (D\Grupa I\JavaScript\Primer7.html)

41
Ponavljanje iskaza dok je uslov ispunjen

• Kad skriptovi moraju da prolaze kroz petlju dok
  god je odredeni uslov ispunjen, ali ne obavezno
  odreden broj puta, mogu da koriste while petlju
• Opšti oblik while petlje
• while (Uslov je ispunjen)
• iskaz

42
Ponavljanje iskaza dok je uslov ispunjen

• Na primer
• while (i lt 10)
• Iskaz
• Kada skript naide na petlju while, prvo proverava
  zadati uslov
• Ako je ispunjen skript izvršava iskaze petlje
  while
• Nakon što se izvrši poslednji iskaz u petlji,
  petlja while ponovo proverava uslov
• Ako je uslov i dalje ispunjen, iskazi ce se
  ponoviti i proces ce se nastaviti
• Kada uslov ne bude ispunjen, petlja ce se
  završiti i skript ce nastaviti izvršenje od
  prvog iskaza koji sledi petlju

43
Primer 8.

• lthtmlgt
• ltheadgt
• lttitlegt While petlja lt/titlegt
• lt/headgt
• ltbodygt
• ltscript type"text/javascript"gt
• lt!--
• i 0
• while (i lt 10)
• document.write("The number is " i)
• document.write("ltbrgt")
• ii1
• // --gt
• lt/scriptgt
• lt/bodygt lt/htmlgt
• Snimite dokument pod nazivom Primer8.html na D
  disk (D\Grupa I\JavaScript\Primer8.html)

44
Obrada dogadaja u JavaScriptu
Atribut obrade dogadaja Primenjuje se na Dogadaj nastupa kad
onClick Polja za potvrdu, hiperveze, aktivno mesto na slici, dugmad, radio-dugmad, dugmad Submit i Reset Oznake ltagt, ltbodygt, ltinputgt Posetilac pritisne mišem element na obrascu ili hipervezu.
onLoad Telo dokumenta Oznake ltbodygt, ltimggt Citac Weba ucitava Web stranicu.
onMouseOver Podrucja, hiperveze Oznake ltagt, ltbodygt, ltinputgt Posetilac pomeri pokazivac miša u podrucje mapirane slike ili na hipervezu.
onReset Obrasce Oznake ltformgt Posetilac pritisne dugme Reset.
onSubmit Obrasce Oznake ltformgt Posetilac pritisne dugme Submit.
onError Slike, prozore Oznakeltbodygt, ltimggt Citac naide na grešku kada ucitava sliku ili Web stranicu.
45
Obrada dogadaja u JavaScriptu

• onClick"javascript function('value')"
• ili
• onClick"function('value')"

46
Primer 9.

• lthtmlgt
• ltheadgt
• lttitlegt Obrada dogadaja Click lt/titlegt
• lt/headgt
• ltbodygt
• ltformgt
• Primer poziva dijaloga
• ltbrgt
• ltinput type"button" value"Dijalog ALERT!
  onClick"alert('Ovo je dijalog ALERT!')gt
• ltbrgt
• lt/formgt
• lt/bodygt
• lt/htmlgt
• Snimite dokument pod nazivom Primer9.html na D
  disk (D\Grupa I\JavaScript\Primer9.html)

47
Primer 10.

• lthtmlgt
• ltheadgt
• lttitlegt Obrada dogadaja Click lt/titlegt
• lt/headgt
• ltbodygt
• ltformgt
• Primer poziva dijalogaltbrgt
• ltinput type"submit" onClick"alert('Submit
  Me!')"gt
• ltinput type"radio" name"radset"
  onClick"alert('Radio Selected!')"gt
• ltbrgt
• lt/formgt
• lt/bodygt
• lt/htmlgt
• Snimite dokument pod nazivom Primer10.html na D
  disk (D\Grupa I\JavaScript\Primer10.html)

48
Primer 11.

• lthtmlgt
• ltheadgt
• lttitlegt Obrada dogadaja Click lt/titlegt
• lt/headgt
• ltbodygt
• lta href"http//www.htmlgoodies.com"
  onClick"alert('Pristupamo sajtu o
  HTML-u.?')"gtHTML Goodies lt/agt
• lt/bodygt
• lt/htmlgt
• Snimite dokument pod nazivom Primer11.html na D
  disk
• (D\Grupa I\JavaScript\Primer11.html)

www.html.goodies.com
49
Primer 12.

• lthtmlgt ltheadgt lttitlegt Obrada dogadaja MouseOver
  lt/titlegt
• lt/headgt
• ltbody bgcolor"ffffff" text"000000"
  link"0000ff" vlink"800080" alink"ff0000"gt
• ltpgtnbsplt/pgtltpgtnbsplt/pgt
• ltcentergt
• ltfont size"2"gt
• lta href"" onMouseOver"document.bgColor'black'"
  gtBlacklt/agt
• lta href"" onMouseOver"document.bgColor'green'"
  gtGreenlt/agt
• lta href "" onMouseOver"document.bgColor'yellow
  '"gtYellowlt/agt
• lta href "" onMouseOver"document.bgColor'red'"gt
  Redlt/agt
• lta href "" onMouseOver"document.bgColor'brown'
  "gtBrownlt/agt
• lta href "" onMouseOver"document.bgColor'white'
  "gtWhitelt/agt
• lt/fontgt
• lt/centergt
• lt/bodygt
• lt/htmlgt
• Snimite dokument pod nazivom Primer12.html na D
  disk (D\Grupa I\JavaScript\Primer12.html)

50
Primer 13.

• lthtmlgt
• ltheadgt lttitlegt Obrada dogadaja Error lt/titlegt
• ltscript type"text/javascript"gt
• function abortImage()
• alert('Error Loading of the image was
  aborted')
• lt/scriptgt
• lt/headgt
• ltbodygt
• ltimg src"image.gif" onError"abortImage()"gt
• lt/bodygt
• lt/htmlgt
• Snimite dokument pod nazivom Primer13.html na D
  disk (D\Grupa II\JavaScript\Primer13.html)

51
Primer 13a.

• lthtmlgt
• ltheadgt lttitlegt Obrada dogadaja Error lt/titlegt
• lt/headgt
• ltbodygt
• ltimg src"image.gif" onError"alert('The image
  could not be loaded.')"gt
• lt/bodygt
• lt/htmlgt
• Snimite dokument pod nazivom Primer13a.html na D
  disk
• (D\Grupa II\JavaScript\Primer13a.html)

52
Primer 14.

• lthtmlgt ltheadgt
• lttitlegt Obrada dogadaja Submit i Load lt/titlegt
• ltscript type"text/javascript"gt
• function load()
• window.status"Page is loaded
• lt/scriptgt
• lt/headgt
• ltbody onload"load()"gt
• ltform name"testform" action"http//www.nstrade
  .net/forma.php?actionproizvod"
• onSubmit"alert('Hello ' testform.fname.value
  '!')"gtWhat is your name? ltbrgt
• ltinput type"text" name"fname"gt
• ltinput type"submit" value"Submit"gt
• lt/formgt
• lt/bodygt lt/htmlgt
• Snimite dokument pod nazivom Primer14.html na D
  disk (D\Grupa I\JavaScript\Primer14.html)

53
Primer 15.

• lthtmlgt
• ltheadgt
• lttitlegt Obrada dogadaja Reset lt/titlegt
• lt/headgt
• ltbodygt
• ltform onReset"alert('The form will be reset')"gt
• Firstname ltinput type"text" name"fname"gt ltbrgt
  
• Lastname ltinput type"text name"lname"gt ltbrgt
• ltinput type"reset value"Reset"gt
• lt/formgt
• lt/bodygt
• lt/htmlgt
• Snimite dokument pod nazivom Primer15.html na D
  disk (D\Grupa I\JavaScript\Primer15.html)

54
JavaScript nizovi
55
JavaScript nizovi

• Niz je promenljiva koja sadrži skup vrednosti
  istih tipova podataka
• Na primer, za prodaju pet predmeta prati se
  kolicina i cena svakog predmeta
• var ItemCount1, ItemCount2, ItemCount3,
  ItemCount4, ItemCount5
• var ItemPrice1, ItemPrice2, ItemPrice3,
  ItemPrice4, ItemPrice5
• JavaScript omogucava formiranje jedne promenljive
  koja može da skladišti kolicinu i cenu za svaki
  od 100 predmeta, koristeci sledece iskaze
• var ItemCount new Array(100)
• var ItemPrice new Array (100)

56
JavaScript nizovi

• Svakom elementu niza pristupa se preko indeksa
  koristeci sledecu sintaksu ImeNizaIndex
• Prvi predmet u nizu ima indeks nula (0). Da bi se
  na primer postavila cena i kolicina predmeta 1,
  potrebno je napisati
• ItemCount0 5
• ItemPrice0 125.50
• Kolicina i cena predmeta 100 smešta se u elemenat
  niza sa indeksom 99 sledecim iskazom
• ItemCount99 10
• ItemPrice99 88.66

57
Definicija niza elemenata

• var myArray new Array(3)
• myArray0"ant"
• myArray1"bat
• myArray2"cat
• document.write ("The third element is
  "myArray2)

Broj elemenata niza
Zadavanje elemenata niza
58
Definicija niza elemenata

• Postoje tri nacina definicije niza
• nacin
• myArray"ant","bat","cat"
• document.write ("The third element is
  "myArray2)
• nacin
• myArray new Array(3)
• myArray0"ant"
• myArray1"bat"
• myArray2"cat"
• document.write ("The third element is
  "myArray2)
• nacin
• myArray new Array("ant","bat","cat")
• document.write ("The third element is
  "myArray2)

59
Primer 16.

• lthtmlgt
• ltheadgt
• lttitlegt Primer niza lt/titlegt
• lt/headgt
• ltbodygt
• ltscript type"text/javascript"gt
• var zaposlenik new Array (3)
• zaposlenik0 "Petar"
• zaposlenik1 "Marko"
• zaposlenik2 "Ivana
• document.write(zaposlenik1)
• lt/scriptgt
• lt/bodygt
• lt/htmlgt
• Snimite dokument pod nazivom Primer16.html na D
  disk (D\Grupa II\JavaScript\Primer16.html)

60
Primer 17.

• lthtmlgt
• ltheadgt
• lttitlegt Primer nesortiranog niza lt/titlegt
• lt/headgt
• ltbodygt
• ltscript type"text/javascript"gt
• lt!--
• var myArray new Array()
• myArray0 "Cricket"
• myArray1 "Baseball"
• myArray2 "Football"
• document.write(myArray0 "ltbrgt" myArray1
  "ltbrgt" myArray2)
• //--gt
• lt/scriptgt
• lt/bodygt
• lt/htmlgt
• Snimite dokument pod nazivom Primer17.html na D
  disk (D\Grupa II\JavaScript\Primer17.html)

61
Primer 18.

• lthtmlgt
• ltbodygt
• lttitlegt Primer sortiranog niza lt/titlegt
• ltscript type"text/javascript"gt
• lt!--
• var myArray new Array(3)
• myArray0 "Cricket"
• myArray1 "Baseball"
• myArray2 "Football"
• myArray.sort()
• document.write(myArray0 "ltbrgt" myArray1
  "ltbrgt" myArray2)
• //--gt
• lt/scriptgt
• lt/bodygt
• lt/htmlgt
• Snimite dokument pod nazivom Primer18.html na D
  disk (D\Grupa II\JavaScript\Primer18.html)

62
Primer 19.

• Napravite stranicu na kojoj ce se ispisati svi
  elementi niza, kao i rezultat množenja drugog i
  treceg elementa niza. Niz sadrži pet brojeva 15,
  89, 4, 61, 5

Snimite dokument pod nazivom Primer19.html na D
disk (D\Grupa II\JavaScript\Primer19.html)
63
Primer 19.

• lthtmlgt
• ltheadgt
• lttitlegt Proizvod elemenata niza lt/titlegt
• lt/headgt
• ltbodygt
• ltscript type"text/javascript"gt
• var myArray new Array(5)
• myArray0 "15"
• myArray1 89"
• myArray2 4"
• myArray3 61"
• myArray4 5"
• var mySum myArray1 myArray2
• document.write ("Elementi niza su ltbrgt"
  myArray0 "ltbrgt" myArray1 "ltbrgt"
  myArray2 "ltbrgt" myArray3 "ltbrgt"
  myArray4 "ltbrgt lthrgt ltbgt Proizvod drugog i
  treceg elementa niza jelt/bgt" mySum " . ")
• lt/scriptgt
• lt/bodygt
• lt/htmlgt

64
Zadatak

• Napravite stranicu koja sadrži tri radio dugmeta
  oznacena istim nazivima (nameradioset) i
  svojstvom value
• Lightblue
• Lightyellow
• Lightgreen
• Koja se koriste za promenu boje pozadine tekuce
  stranice.
• Pored svakog radio dugmeta navesti natpise za
  odgovarajucu boju.
• Snimite dokument pod nazivom Zadatak.html na D
  disk
• (D\Grupa II\JavaScript\Zadatak.html)

65
Zadatak

• lthtmlgt
• ltheadgt
• lttitlegt Zadatak lt/titlegt
• lt/headgt
• ltbodygt
• ltform name"go"gt
• lightblue ltinput type"radio" nameradioset"
  value"lightblue" onclick"document.bgColor'light
  blue'"gt
• lightyellowltinput type"radio" nameradioset"
  value"lightyellow" onclick"document.bgColor'lig
  htyellow'"gt
• lightgreenltinput type"radio" nameradioset"
  value"lightgreen" onclick"document.bgColor'ligh
  tgreen'"gt
• lt/formgt
• lt/bodygt
• lt/htmlgt