Java Script - PowerPoint PPT Presentation

About This Presentation
Title:

Java Script

Description:

Java Script JavaScript JavaScript je skript jezik kojim Web dizajneri mogu da automatizuju postupke unutar Web stranice Skript jezik - jer omogu ava pisanje skripta ... – PowerPoint PPT presentation

Number of Views:110
Avg rating:3.0/5.0
Slides: 66
Provided by: apo175
Category:
Tags: java | script | support

less

Transcript and Presenter's Notes

Title: 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
Write a Comment
User Comments (0)
About PowerShow.com