You are on page 1of 47

Uvod u JavaScript

Sran Panti <srdjan@pantic.co.yu>

mart 1997. godine

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Uvod u JavaScript

ta je to JavaScript?
Javascript je novi skript jezik za korienje u programiranju WWW prezentacija. Uveden je od strane Netscapea u Netscape Navigator, poevi od verzije 2.0, uporedo sa uvoenjem podrke za Javu. Brzo je postigao veliku popularnost i rairenost, toliku da je i sam Microsoft pored uvoenja svog skript jezika - Visual Basic Script, koji je kompatibilan sa Visual Basicom i Visual Basic for Aplication, uveo svoju verziju JavaScripta - JScript. Jedini razlog zato Microsoft nije licencirao JavaScript kao takav jeste to nije dobio licencu. Javascript se ukljuuje u sadraj HTML dokumenta i omoguava unapreenje HTML strana sa interesantnim efektima. Na primer, korienjem JavaScripta je mogue odgovarati na akcije korisnika u samom WWW itau. Ono to je bitno zapamtiti jeste da JavaScript program moe da se izvraava samo u okviru WWW itaa i nigde drugde. Najbolji nain za upoznavanje sa jednim Internet orjentisanim jezikom, kakav JavaScript jeste, je ba na Internetu. Veliki broj primera, dokumentacije i svega drugog vezanog za JavaScript moete nai na Gamelanu, WWW serveru posveenom Javi i JavaScriptu,http://www.gamelan.com. Izvornu dokumentaciju samog Netscapea moete nai na http://home.netscape.com. U ovom dodatku opisujemo JavaScript verziju 1.1, koja je podrana od strane Netscape Navigatora 3.0 i kasnijih. Microsoftova verzija JScripta je kompatibilna sa JavaScriptom 1.0 i na razlike izmeu njih emo ukazati u tekstu.

Koje su razlike izmeu Jave i JavaScripta?


Bez obzira na nazive, Java i JavaScript su razliiti jezici. Oni predstavljaju dve razliite tehnike programiranja na Internetu. Java je programski jezik. JavaScript je (kako mu i samo ime kae) skript jezik. Razlika je u tome to sa Javom moete da kreirate prave programe, koji mogu da se izvravaju potpuno nezavisno od WWW itaa (poput programa napisanih sa C++ ), ili Java aplete koje moete da pozivate iz HTML dokumenta i koji se dovlae preko mree i onda izvravaju u okviru vaeg WWW itaa. Ipak, najee vam za unapreenje HTML dokumenata zaista ne treba teka artiljerija poput Jave, jer elite da napravite neki efekat brzo, ne zamarajui se pravim programiranjem. Tu dolazimo na JavaScript, koji je jednostavan za razumevanje i upotrebu. JavaScript jeste zasnovan na Javi, ali postoje i brojne razlike. Poreenje Jave i JavaScripta Java Prevodi se na serveru pre izvravanja u klijentu. Objektno-orijentisan jezik. Postoji podrka za objekte, klase, nasleivanje... Apleti su odvojeni od HTML dokumenata (iz kojih se pozivaju) Promenljive se moraju deklarisati (jaka tipizacija) Statiko povezivanje: reference objekata moraju postojati u vreme prevoenja. JavaScript Interpretira ga WWW ita - ne prevodi se. Objektno-baziran jezik. Postoje ugraeni objekti. Integrisano u HTML dokument Promenljive se ne moraju deklarisati (slaba tipizacija) Dinamiko povezivanje: reference objekata se proveravaju u vreme izvravanja.

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Sigurne: ne mogu da piu na hard disk.

Sigurne: ne mogu da piu na hard disk.

Kako pokrenuti program pisan u JavaScriptu?


JavaScript bez problema izvravaju Netscape Navigator (od verzije 2.0 gde je i uveden i to na svim platformama) i Internet Explorer (od verzije 3.0), ali e bez sumnje biti podran i od ostalih manje vanih WWW itaa. Da bi programirali u JavaScriptu morate imati osnovno poznavanje HTML-a, a ne samo JavaScripta.

Pozivanje programa unutar HTML dokumenta


Ceo program se smeta unutar HTML dokumenta, unutar SCRIPT elementa. Atribut elementa SCRIPT je LANGUAGE, kojim se tano odreuje o kom se skript jeziku radi. Danas postoje dva skript jezika na WWW: JavaScript (Netsape) i VisualBasic Script (Microsoft).
Primer 1 Jednostavni JavaScript program

<HTML> <HEAD> <TITLE> Jednostavan JavaScript </TITLE> </HEAD> <BODY> Tekst prikazan na uobiajen nain. <BR> <SCRIPT LANGUAGE=JavaScript> document.write(<B>Tekst prikazan iz JavaScripta.</B>) </SCRIPT> </BODY> </HTML> JavaScript se unutar HTML dokumenata uvek mora nai unutar SCRIPT elementa. Obratite pri tome panju da ako HTML dokument sa JavaScriptom pokuamo da pogledamo sa nekim WWW itaom koji nema ugraenu podrku za JavaScript, gornji dokument e se nepravilno prikazati. ita e, prema specifikaciji HTML jezika ignorisati sve oznake unutar < i > koje ne ume da tumai. Problem koji ovde imamo je to skript zapravo nije unutar < i >. Stariji WWW itai bi prema tome sam skript prikazali kao tekst to je efekat koji sigurno ne elimo da izvedemo. Da bi to izbegli, potrebno je sam skript stavljati u oznake komentara <!-- i -->. Pravilno napisan, primer 1 izgledae ovako:
Primer 2

Jednostavni JavaScript program, koji nee smetati WWW itaima koji ne podravaju JavaScript

<HTML> <HEAD>

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

<TITLE> Jednostavan JavaScript </TITLE> </HEAD> <BODY> Tekst prikazan na uobiajen nain. <BR> <SCRIPT LANGUAGE=JavaScript> <!-- Krije kod od starih WWW itaa document.write(<B>Tekst prikazan iz JavaScripta.</B>) // Kraj skrivanja koda --> </SCRIPT> </BODY> </HTML> Komentar u sam skript stavljamo iza dvostruke kose crte (//), ili ih zatvaramo izmeu /* i */. Kada WWW ita prikazuje HTML dokument on ide redom i kada naie na skript on e ga i izvriti ako ima podrku za njega.

U gornjem primeru skript samo ispisuje u tekui dokument poruku. Objekat document ovde se odnosi na tekui dokument, a metodom write ispisujemo sam tekst.

Pozivanje eksternih skriptova


Ukljuivanje JavaScript programa direktno u HTML dokumenta je dobro reenje za male skriptove i jednostavne HTML dokumente, ali lako moe da izmakne kontroli kada je re o velikim i kompleksnim skriptovima. Zato je u takvim sluajevima najpogodnije reenje uvanje JavaScript programa u posebnom fajlu, odvojenom od HTML dokumenta i njegovom pozivanju od strane HTML dokumenta za koji je skript potreban. Na taj nain isti skript moemo da koristimo u raznim HTML dokumentima, bez optereivanja svih njih istim kodom.

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Da bi to omoguili, uveden je atribut SCR za SCRIPT element. On je vaei od verzije 3.0 Netscape Navigatora. Fajl koji je naveden kao mesto u kome se nalazi JavaScript program se obavezno mora zavravati sa ekstenzijom .js.
<SCRIPT LANGUAGE="JavaScript" SRC="http://www.kombib.com/skript.js"> </SCRIPT>

Ako JavaScript program pozivate iz spoljnog fajla, najbolje mesto za SCRIPT element je u zaglavlju HTML dokumenta, kako bi se uitao odmah po preuzimanju HTML dokumenta. Ova tehnika zahteva dodatni pristup HTTP serveru i dodatni njegov odgovor za svaki ukljueni spoljni fajl, tako da predstavlja loe reenje, ako se HTTP server nalazi na sporom linku ka Internetu i ako je veoma optereen.

Tipovi podataka
JavaScript prepoznaje sledee osnovne tipove podataka: numbers, celi i realni brojevi, booleans, mogu uzeti vrednost true ili false, strings, sadre niz karaktera, null, koji predstavlja rezervisanu kljunu re za null objekt i ne predstavlja zapravo tip podatka.

U JavaScriptu imena promenljivih se sastoje od sekvenci slova (a-z, A-Z), cifara (0-9) i donje crte (_). JavaScript razlikuje velika i mala slova. U JavaScriptu ne moramo eksplicitno da deklariemo promenljivu (mada je to dobra praksa) JavaScript je slabo tipiziran jezik. Tipovi podataka e biti automatski konvertovani zavisno od mesta njihove upotrebe u programu. Tako na primer moemo definisati i inicijalizovati sledeu promenljivu var promenljiva=42 a kasnije je moemo predefinisati, dodeljujui joj niz karaktera, na primer promenljiva=Odgovor za sve tajne svemira je... Dobra je praksa definisati promenljivu sa var, kada je uvodimo. Specijalna kljuna re null ukazuje da je promenljivoj dodeljena null vrednost. To ne znali da je promenljiva nedefinisana! Promenljiva je nedefinisana kada joj nije dodeljena nikakva vrednost i tada je ne moemo dodeliti drugoj promenljivoj ili koristiti u izrazima, a da ne dobijemo run-time greku. Primeri ispravnih promenljivih: Broj_pogodaka privremena90 _ime

Celi brojevi
Celi brojevi u JavaScriptu mogu biti predstavljeni u tri osnove: u decimalnom (baza 10), u oktalnom (baza 8) i heksadecimalnom (baza 16) formatu.

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Decimalni celi brojevi se predstavljaju kao niz cifara (0-9) bez vodee nule. Oktalni celi brojevi se predstavljaju kao niz cifara (0-7) predvoen sa nulom (0). Heksadecimalni celi brojevi se predstavljaju kao niz cifara (0-9) i slova (a-f i A-F) predvoen sa nulom koju sledi slovo x (0x ili 0X). Primer prestavljanja decimalnog celog broja deset (10) u tri brojna sistema: decimalnom: 10. oktalnom: 012. heksadecimalnom: 0xA.

Brojevi u pokretnom zarezu


Brojevi u pokretnom zarezu imaju sledee delove: decimalni ceo broj, decimalnu taku (.), deo iza decimalnog zareza (decimalni ceo broj), eksponent (e ili E, praen decimalnim celim brojem). Primeri brojeva u pokretnom zarezu: 3.1415 .1E12 -3.1E12 2E-10

Boolean
Promenljive ipa Boolean moe da ima samo dve vrednosti: true (tano) i false (netano).

Stringovi
String je niz karaktera sainjen od nula ili vie karaktera zatvorenih u jednostrukim () ili dvostrukim () navodnicima. Primeri stringova: string 1234 PRVA LINIJA \n druga linija

Specijalni karakteri
U JavaScript stringovima moete koristiti sledee specijalne znake: \b, backspace, \f, form feed, \n, new line,

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

\r, carriage return, \t, tab. Takoe je esto neophodno koristiti navodnike unutar niza karaktera. To moete uraditi korienjem obrnute kose crte. Na primer:
var navod=<P>Sa radou je itao Tolkinovog \Gospodara prstenova \. document.write(navod)

JavaScript izrazi i operatori


Izraz je ma koji, ispravan, skup konstanti, promenljivih, operatora i izraza koji se moe dovesti do jedne vrednosti. Ta vrednost moe biti broj (na primer, 7), string (Mikroraunari) ili logika vrednost ( true ili false). Operatori koje JavaScript podrava su poznati svima koji su imali prilike da rade u jeziku C ili C++. To su standardni aritmetiki operatori: sabiranje (+), oduzimanje (-), mnoenje (*), delenje (/), moduo dva broja (deli15 % 5, vraa 2), inkrement (x++ i ++x), dekrement (x-- i --x) i unarna negacija (-x negira vrednost promenljive x). logiki operatori: logiko I ( a && a), logiko ILI (a || b), logika negacija (!a) binarni operatori: binarni logiki operatori (I - a & b, ILI - a | b, ekskluzivno ili XOR - a ^ b) i binarni operatori pomeraja (levi pomeraj - a << n, desni pomeraj sa uvanjem znaka - a >> n i desni pomeraj sa punjenjen nulama mesta najvee teine - a >>> n; pomeraj bitova promenljive a za n mesta ulevo ili udesno). operatori poreenja: jednako (a==b), nije jednako (a!=b), vee (a>b), vee ili jednako (a>=b), manje (a<b), manje ili jednako (a<=b). operatori stringova: konkatenacija, spajanje dva stringa (ja + volim Tanju nam vraa string ja volim Tanju) Dozvoljeni su i svi oblici skraenog ispisa operacije i dodele poznati iz jezika C i C++: x+=y, to znai x=x+y x-=y, to znai x=x-y x*=y, to znai x=x*y x/=y, to znai x=x/y x%=y, to znai x=x%y x<<=y, to znai x=x<<y x>>=y, to znai x=x>>y x>>>=y, to znai x=x>>>y x&=y, to znai x=x&y x^=y, to znai x=x^y x|=y, to znai x=x|y

Kontrola izvravanja programa


JavaScript podrava kontrolne strukture poznate veini programera iz drugih jezika, poput:

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

while petlje, iz koje moemo izai sa break (primer izraunava sumu svih brojeva od 0 zakljuno sa 10)

{ n=0;Suma=0 while (n<=10) { n++;Suma+=n } } for petlja (primer ispisuje svih est nivoa naslova): { for(i=1;i<=6;i++){ document.write(<H+i+> Naslov nivoa i </H+i+>) } } for .. in, pomou nje moemo proi kroz sve osobine (properties) nekog objekta. Koliko jedan objekat ima osobina, toliko puta e se izvriti ova for petlja.

{ for (prom in obj){ proveri() } }

break, prekida izvravanje for ili while petlje i nastavlja se izvrenje skripta posle petlje koja je prekinuta: { while(i<5) { if(i==2){ break} } }

continue, prekida izvravanje bloka naredbi u petlji i nastavlja izvravanje petlje u sledeoj iteraciji: { while(i<5) { if(i==2){ continue} } }

if..else, poznato svima odranije, moe postojati samo u obliku if(uslov){} kao u ilustraciji naredbe continue ili if(uslov){ } else { }: if (n>2){

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

document.write(N je vee od 2) } else { document.write(N je manje ili jednako 2) }

Rezervisane rei
Rezervisane rei iz ove liste ne mogu da se koriste kao nazivi promenljivih, funkcija, metoda ili objekata JavaScripta. Neke od ovih rei se koriste u JavaScriptu, dok su druge rezevisane za budue korienje, abstract boolean break byte case catch char class const continue default do double else extend false final finally float for function goto if implements import in instanceof int interface long native new null package private protected public return short static super switch synchronized this throw throws transient true try var void while with

Osnove JavaScripta
Da bi smo mogli da ponemo sa pisanjem programa u JavaScriptu, potrebno je da smo upoznati sa osnovnom strukturom i sintaksom naredbi JavaScripta. Naredbe i struktura JavaScripta veoma podseaju na onu korienu u jezicima Java, C++ i C. JavaScript program je izgraen iz funcija i naredbi, operatora i izraza. Osnovna jedinica je naredba ili izraz koji se zavrava sa takom-zarezom. document.writeln("Ovo radi!<BR>"); Gornja komanda poziva writeln() metod, koji je deo document objekta. Taka-zarez ukazuje na kraj komande. JavaScript komanda se moe rasprostreti na vie redova, sve dok se zavrava sa takom-zarezom. Isto tako, moe se vie naredbi nai u jednom redu, sve dok se zavrava sa takomzarezom.

Komandni blokovi
Moemo grupisati naredbe u blokove naredbi, izdvojenih velikim zagradama: { document.writeln("Da li ovo radi? "); document.writeln("Radi!<BR>"); } Blokovi naredbi se koriste u definiciji funkcija i kontrolnim strukturama.

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Izlaz iz JavaScripta
Jedna od osnovnih mogunosti svakog programskog jezika je da poalje tekst na izlaz. Ni JavaScript nije izuzetak. U JavaScriptu izlaz moe biti preusmeren na nekoliko mesta ukljuujui trenutni prozor dokumenta i pop-up dijalog. Osnovni izlaz je preusmeravanje teksta u prozor WWW klijenta, to se obavlja prosleivanjem HTML koda. Rezultujui tekst e biti interpretiran kao HTML kod i prikazan u prozoru WWW klijenta. To ostvarujemo sa metodima write (alje tekst u prozor WWW itaa bez pomeranja) i writeln (isto kao write(), s tim to se posle ispisa teksta kurzor pomera u sledei red) objekta document: document.write("Test"); document.writeln('Test');

Primer 3 Izlaz HTML elemenata iz JavaScripta

<HTML> <HEAD> <TITLE>Izlazni tekst</TITLE> </HEAD> <BODY> Obian tekst.<BR> <B> <SCRIPT LANGUAGE="JavaScript"> <!-document.write("Boldiran tekst.</B>"); // --> </SCRIPT> </BODY> </HTML>

Alert()
Jedna od velikih ogranienja HTML-a je to je dizajner sa HTML-om ogranien samo na jedan prozor za prikaz dokumenata. Ako bi iz istog HTML-a eleo da poalje potvrdu korisniku da je neki tekst ispravno unet u formi (ili slino) to bi zahtevalo prilino ongliranje. Sa JavaScriptom je sve to veoma jednostavno.JavaScript ima mogunost da kreira male dijaloge za ispis ili unos teksta koji su sadrajem potpuno nezavistan od sadraja HTML dokumenta, a niim isti ne remeti. Najjednostavniji nain da se prosledi kratka poruka korisniku je korienje alert metoda. alert("Kliknite na OK za nastavak.");

Sigurno ste primetili da metod alert() nema ime objekta ispred sebe. Razlog za to je to pripada objektu windows, koji je u osnovi stabla objekata Navigatora i zato se uvek podrazumeva kada se negde ispred metoda naziv objekta ne navede. Znai, puno ime za alert() metod bi bilo: windows.alert("Kliknite na OK za nastavak.");

10

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Generalno, alert() metod se koristi tano za to - da upozori korisnika na neto. Na primer, na netano unet podatak u formu, pogrean rezultat kalkulacije...
Primer 4 Prikaz poruke u dijalogu

<HTML> <HEAD> <TITLE>Primer 4</TITLE> </HEAD> <BODY> <SCRIPT LANGUAGE="JavaScript"> <!-alert("Dobrodoli!\n\n Koristite WWW ita sa JavaScriptom."); document.write('<P>Sve najbolje</P>'); // --> </SCRIPT> </BODY> </HTML>

Interakcija sa korisnikom
Alert() metoda nam omoguava da poaljemo poruku korisniku, ali ne i da preuzmemo odgovor

od njega. Da bi smo omoguili jednostavnu interakciju sa korisnikom, koristimo metod prompt(). Poput alert() i prompt() kreira dijalog prozor u kome se moe proslediti poruka korisniku, ali se formira i polje u koje korisnik moe uneti proizvoljan tekst. Mogue je takoe da se predloi vrednost u tom polju, koju korisnik moe prihvatiti ili ignorisati. prompt("Unesite Vae ime:","anonymous"); Ako gornji primer primenimo bez promene u naem programu, primetiemo da ne moemo da pristupimo informaciji u polju koju je uneo korisnik. Ta informacija se vraa kao rezultat metoda prompt(). Da bi smo iskoristili tu informaciju moramo da dodelimo metod prompt() drugom metodu ili promenljivoj. Na primer:

11

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

document.write("Dobronam doli "); document.writeln(prompt("Unesite Vae ime:","anonymous")); ili ime_korisnika = prompt("Unesite Vae ime:","anonymous"); Koristei metod prompt()sad moemo da napiemo liniju verziju programa iz primera 5.
Primer 5 Personalizovana verzija pozdravne poruke

<HTML> <HEAD> <TITLE>Primer 5</TITLE> </HEAD> <BODY> <SCRIPT LANGUAGE="JavaScript"> <!-document.write("<H1>Dobrodoli, "); document.writeln(prompt("Unesite Vae ime:","anonymous")); document.write(" u svet JavaScripta!</H1>"); document.write('<P>estitamo</P>'); // --> </SCRIPT> </BODY> </HTML>

Funkcije
Funkcije predstavljaju jednu od osnova JavaScripta. im budete poeli da piete sloenije programe, brzo ete otkriti potrebu da odreene poslove i akcije izvravate vie puta tokom izvravanja programa. Tu do izraaja dolaze funkcije. Funkcije su sline metodima kod objekata (vie o objektima moete nai kasnije u poglavlju, u delu Objekti u JavaScriptu), s tim to ne pripadaju nijednom objektu. Moete kreirati proizvoljan broj funkcija u programu. Funkcija u JavaScriptu predstavlja skup naredbi koje obavljaju odreen posao i koja moe da vraa neku vrednost, bilo podatak ili objekt. Funcije mogu da imaju parametre koji se prenose po vrednosti.

12

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Doputena je rekurzija. U HTML dokumentu moete koristiti sve funkcije koje su definisane u njegovom okviru. Generalno se funkcija moe smestiti bilo gde u okviru jednog HTML dokumenta, ali je dobra praksa grupisati sve funkcije u okviru zaglavlja HTML dokumenta, izmeu elementa <HEAD> i </HEAD>. Tako e, kada korisnik uita HTML dokument, funkcije biti uitane prve. Unutar funkcije je mogue pozvati druge funkcije definisane unutar istog HTML dokumenta. Funkcija se sastoji od rezervisane rei function, praene sa imenom funcije, zatim listom parametara funkcije, odvojenih zarezima i zatvorenih u malu zagradu i skupom JavaScript naredbi koje ine telo funkcije zatvorenih u velike zagrade. Tako moemo definisati funkciju koja nee vratiti nikakav podatak ili objekt, ve e izvriti odreeni zadatak, u donjem sluaju odtampae u HTML dokument neki tekst, ime se ostvaruje dinaminost HTML dokumenta u optem sluaju (ne mora biti isti svaki put kada ga pozovemo):

function stampaj(string){ document.write(<P> + string) }

Prosleivanje parametara
U gornjem primeru moete videti da funkcija stampaj () ima argument, promenljivu string. Unutar funkcije, moemo pristupati toj promenljivi u kojoj je vrednost prosleena funkciji. Funkciji se po vrednosti mogu prosleivati i promenljive i konstante. Ukoliko se promenljiva prosledi funkciji, promena vrednosti parametra unutar funkcije ne menja vrednost promenljive koja je prosleena funkciji. Parametri postoje samo za ivota funkcije. Ukoliko zovete funkciju vie puta, svaki put kada zovete funkcije imaete nove parametre, odnosno vrednost koji e parametri imati na kraju prethodnog poziva funkcije nee biti sauvana. Na primer, kada funkciju stampaj () pozovemo sa promenljivom ime: var ime = "Tanja"; stampaj (); kada funkcija pone da se izvrava, promenljiva string u funkciji e imati vrednost "Tanja". Isto tako, funkciju stampaj () moemo da pozovemo sa konstantom: stampaj (Tanja); kada funkcija pone da se izvrava, promenljiva string u funkciji e takoe imati vrednost "Tanja".

Izvravanje funkcija iz HTML dokumenta


To to smo definisali funkciju ne znai i da smo je izvrili. Moramo pozvati funkciju da bi smo je izvrili. Pozivanje funkcije se moe obaviti na vie naina.

13

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

1. Iz druge funkcije ili JavaScript programa: <SCRIPT LANGUAGE=JavaScript> stampaj(Ovo je tekst koji e se prikazati.) </SCRIPT>

2. Kao reakciju na dogaaj: <body OnLoad="stampaj(Ovo je tekst koji e se prikazati.)"> 3. Izborom linka vezanog za dogaaj: <a href="javascript:stampaj(Ovo je tekst koji e se prikazati.);">tampaj</a>

Vraanje rezultata iz funkcije


Kao to je prethodno pomenuto, funkcija moe da vraa rezultate. Rezultat se iz funkcije vraa korienjem naredbe return. Koristi se za vraanje bilo kog ispravnog izraza koji moe da se izrauna u jednu vrednost. Na primer, u funciji kub(): function kub(broj) { var kub = broj * broj * broj; return kub; } naredba return vraa vrednost promenljive kub. Istu funkciju smo mogli da napiemo i na sledei nain, preko vraanja izraza:

function kub(broj) { return broj * broj * broj; } Izraz broj * broj * broj e se izraunati u jednu vrednost.

Prosleivanje objekata funkciji


Parametri jedne funkcije nisu ogranieni samo na nizove karaktera i brojeve. Moete prosleivati itave objekte funkciji (vie o objektima moete nai u sledeem delu poglavlja, u sluaju da ne razumete najbolje prosleivanje objekata funkciji, pogledajte deo Objekti u JavaScriptu, pa se vratite ponovo ovom delu). U gornjem primeru smo pozvali funkciju koja nije vratila nikakvu vrednost. U sledeem primeru moete videti upotrebu funcije kojoj se kao parametar prenosi itav objekat, koja koristi for.. in petlju da bi prebrojala sva svojstva objekta i koja vraa kao rezultat niz karaktera u kome su navedena sva svojstva i njihove vrednosti. Rezultat rada funkcije se vraa programu sa naredbom return iji je parametar vrednost koja se vraa programu. Tako se u donjem sluaju vraa vrednost promenljive rezultat.

function vidi_svojstva(objekat, ime_objekta){

14

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

var i, rezultat = for (i in objekat) rezultat += ime_objekta + . + i + = + objekat[i] + \n return rezultat } Tako da ako funkciju pozovemo sa vidi_svojstva(Kola, Kola), gde su Kola objekat koji ima sledea svojstva: proizvodjac, model i godina_proizvodnje (i oni imaju vrednosti Zastava, YUGO 55 i 1990) kao rezultat emo dobiti: Kola.proizvodjac = Zastava Kola.model = YUGO 55 Kola.godina_proizvodnje = 1990

Rekurzivnost funkcija
Funkcije mogu biti rekurzivne, odnosno mogu pozivati same sebe. Klasian primer za demonstraciju rekurzije je naravno izraunavanje faktorijela nenegativnog broja:

function faktorijel(n){ if ((n==0)||(n==1)) return 1 else { rezultat = (n * faktorijel(n-1)) return rezultat } }

Rekurzija funkcija je veoma mona stvar, ali moe biti i veoma opasna. Duboke rekurzije, ak iako nisu beskonane, mogu prouzrokovati pucanjeWWW itaa.

Promenljive u funkciji
Primetite da smo u funciji vidi_svojstva definisali promenljive sa naredbom var. To otvara pitanje o dubini vaenja promenljivih. Ako smo promenljivu definisali naredbom var u funkciji, oblast vanosti promenljive je ta funkcija. Ako je promenljiva definisana van funcija, oblast njene vanosti je u celom skriptu, ona je globalna promenljiva. Ako definiemo lokalnu promenljivu unutar funkcije sa istim imenom koju ve ima neka globalna promenljiva, u toj funkciji e se kreirati nova verzija promenljive ija je oblast vaenja funkcija, dok globalna promenljiva sa istim imenom nee promeniti vrednost. Kada se argumenti prosleuju funkciji, dva svojstva se kreiraju koja mogu biti korisna u radu sa argumentima: imefunkcije.arguments i imefunkcije.arguments.lenght. imefunkcije.arguments je niz iji su elementi argumenti funkcije, a imefuncije.arguments.lenght je celobrojna promenljiva u kojoj se nalazi broj argumenata funkcije.

15

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Ugraene funkcije JavaScripta


JavaScript ima nekoliko funkcija ugraenih u sam jezik. To su: eval, parseInt, parseFloat, escape, unescape, isNaN.

Eval
Ugraena funkcija eval uzima string kao argument. String moe da sadri ma koji string koji predstavlja JavaScript izraz, naredbu ili sekvencu naredbi. Izraz moe da ukljuuje promenljive i osobine postojeih objekata. Ako argument predstavlja izraz, eval e izraunati izraz. Ako argument predstavlja jednu ili vie JavaScript naredbi, eval e izvriti te naredbe. Ova funkcija je korisna za transformisanje stringa koji predstavlja numeriki izraz u broj. Na primer, ulaz u polje forme je uvek string, ali najee elimo da ga izarazimo kao broj, ako je to mogue.

ParseFloat
ParseFloat vraa vrednost izraenu kao broj u pokretnom zarezu. Sintaksa naredbe je ParseFloat(string) ParseFloat pokuava da parsira string i ako susretne ma koji karakter, osim znaka (+ ili -),decimalne take ili eksponenta, tada vraa vrednost koju je mogao da parsira do te take i ignorie karakter na koji je naiao i sve karaktere koji ga slede. Ako prvi karakter nije mogao da se konvertuje u broj, vraa se NaN (0 na Windows platformi).

ParseInt
ParseInt vraa vrednost izraenu kao celobrojan broj. Sintaksa naredbe je ParseInt(string, osnova) ParseInt funkcija parsira svoj prvi argument i pokuava da vrati celobrojni broj u traenoj osnovi. Kada prvi put naleti na karakter koji nije cifra (cifra u traenoj osnovi, za osnovu 16, cifre su 0-9, A-F), vraa broj od prethodnih cifara i ignorie karakter na koji je naletela i sve posle njega. Ako prvi karakter nije mogao da se konvertuje u broj, vraa se NaN (0 na Windows platformi).

16

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Escape
Vraa string koji sadri ASCII kod karaktera u obliku %xx (gde je xx numeriki kod karaktera). Sintaksa mu je escape(karakter)

isNaN
Testira vrednost da proveri da li je sluajno NaN. Funkcija je raspoloiva samo na UNIX paltformama, gde neke funkcije vraaju NaN, ako im argument nije broj. Sintaksa je isNaN(vrednost)

unescape
Vraa karakter zasnovan na ASCII kodu sadranu u stringu. ASCII kod treba da uzme oblik "%integer" ili "heksadecimalnaVrednost". Sintaksa je unescape(karakter)

Dogaaji u JavaScriptu
JavaScript programi su veinom pokretani dogaajima (event-driven). Dogaaji su akcije koje se pojavljuju, obino, kao rezultat neega to korisnik uradi. Na primer, dogaaj je kliktanje miem, kada elemenat forme dobije fokus i slino. Koristei obraivae dogaaja (eng. event handler) ugraene u JavaScript, mogu se pisati funkcije koje se aktiviraju kada se odreeni dogaaj desi. Obraivai dogaaja su predstavljeni kao specijalni atributi koji modifikuju ponaanje HTML elemenata u okviru koji se nalaze. Na primer: <body OnLoad="alert(Dobrodoli!)"> U gornjem primeru, oznaci poetka tela HTML dokumenta dodat je atribut OnLoad, koji obrauje dogaaj uitavanja HTML dokumenta. U konkretnom sluaju, kada se uitavanje HTML dokumenta zavri, izvrie se naredba JavaScripta dodeljena atributu OnLoad, u prozoru e se ispisati poruka Dobrodoli. Generalno, sintaksa za upotrebu obraivaa dogaaja je: <HTML_Oznaka Ostali_atributi eventHandler="JavaScript program">

ta su to dogaaji?

17

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Dogaaji su signali koji se generiu kada se odigra odreena akcija. JavaScript moe da detektuje te signale i mogu da se piu programi koji reaguju na te dogaaje. Dogaaji u WWW itau su kada korisnik klikne na hipertekst link, kada se promeni podatak u ulaznoj polji forme ili kada se zavri uitavanje WWW dokumenta.

Dogaaji u JavaScriptu Dogaaj blur Opis Dogaa se kada se ulazni fokus prebaci sa elementa forme (kada korisnik klikne van polja forme). Dogaa se kada korisnik klikne na formu ili na link. Dogaa se kada korisnik promeni vrednost u text, textarea ili select elementima forme. Dogaa se kada polje forme dobije ulazni fokus. Dogaa se kada se uitava HTML dokument u WWW ita. Dogaa se kada korisnik pomera mia preko objekta. JavaScrip 1.1, JSCript nema ovaj dogaaj. Dogaa se kada mi pree preko objekta. Dogaa se kada korisnik izabere ulazno polje forme. Dogaa se kad je forma prosleena HTTP serveru (kada korisnik klikne na dugme za slanje sadraja forme). Dogaa se kada korisnik naputa HTML dokument, pre nego to pone sa uitavanjem novog HTML dokumenta. Obraiva dogaaja onBlur

click change

onClick OnChange

focus load mouseover

OnFocus OnLoad OnMouseOver

mouseout select submit

OnMouseOut OnSelect OnSubmit

unload

OnUnload

Dogaaje vezujemo za sledee HTML elemente: Focus, Blur, Change dogaaji: tekst polja forme, textarea i selekcije, Click dogaaj: dugmad, linkove, polja za izbor, polja za selekciju, Select dogaaj: tekst polja forme, textarea, MouseOver dogaaj: linkovi.

Objekti JavaScripta i dogaaji vezani za njih Objekt Lista za izbor Text element Textarea element Button element Checkbox Raspoloiv obraiva dogaaja onBlur, onChange, onFocus onBlur, onChange, onFocus, onSelect onBlur, onChange, onFocus, onSelect onClick onClick

18

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Radio Button Hypertext Link Reset Button Submit Button Document Window Form

onClick onClick, onMouseOver onClick onClick onLoad, onUnload onLoad, onUnload onSubmit

Emuliranje dogaaje
Dosta objekata ima metode koji emuliraju dogaaje. Na primer, dugmad imaju click metod koji emulira dugme koje se pritisne. On nee okinuti onClick obraiva dogaaja. Naravno, uvek moete direktno pozvati onClick iz programa. To moe biti posebno korisno ako elimo da prosledimo sadraj forme bez da traimo da korisnik klikne na dugme za prenos (submit button). U JavaScriptu su raspoloivi sledei emulatori dogaaja: blur() click() focus() select() submit()

JavaScript obraivai dogaaja


JavaScript 1.1 trenutno podrava deset dogaaja da bi program mogao da odgovori na aktivnosti sistema i na akcije korisnika. Obraivai dogaaja se mogu podeliti na dve kategorije: sistemski dogaaji i dogaaji uzrokovani akcijama mia.

Sistemski dogaaji
Sistemski dogaaji ne zahtevaju nikakvu akciju korisnika da bi se aktivirali. Na primer, to je signal da se HTML dokument uitao, da e trenutni HTML dokument biti izbaen, ili da je protekao odreeni period vremena.

OnLoad
Ovaj dogaaje se aktivira poto se traen HTML dokument (i svi njegovi delovi) kompletno uita. Dodeljen je elementima <BODY> i <FRAMESET>. Kada radite sa okvirima, esto je neophodno da budete sigurni da su neki okviri uitani, pre nego to druge obnovite ili promenite (na primer, u sluaju kada jedan okvir sadri formu, ije elemente referencira drugi okvir). S obzirom na prirodu Internteta, ne postoje garancije kada e se i u kom roku uitati neki dokument (optereenje linka moe biti veliko, ili isti moe biti u prekidu), ali ako koristite OnLoad, moete biti sigurni da su svi ostali okviri uitani.

19

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Primer 6 Primer upotrebe dogaaja OnLoad

<html> <head> <script language="JavaScript"> <!-function welcome(){ window.alert("Dobrodoli u svet JavaScripta!"); } // --> </script> </head> <body OnLoad="welcome()"> <h3>OnLoad</h3> <hr> Prvo ete videti ovaj tekst i moda ete ak i imati ansu da ga proitate. Ali potom e se otvoriti prozor sa porukom dobrodolice. <p> OnLoad dogaaj aktivirae funkciju welcome() poto se uita ceo dokument. </body> </html>

OnUnload
Dogaaj OnUnload je koristan za ienje posle posete nekoj prezentaciji. Tokom posete nekoj prezentaciji, korisniku se moe desiti da ima otvoreno nekoliko prozora kao rezultat rada programa u JavaScriptu. Njih treba zatvoriti, a to se najlake obalja obraivanjem dogaaja OnUnload.
Primer 7 Primer upotrebe dogaaja OnUnload

<html>

20

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

<head> <title>Primer za OnUnload</title> <script language="JavaScript"> <!-function dovidjenja(){ window.alert("Hvala to ste svratili."); } // --> </script> </head> <body OnUnload="dovidjenja()"> <h3>OnUnload</h3> <hr> Kada napustite ovu stranicu dobiete pozdravnu poruku. </body> </html> U ovom primeru, kada korisnik naputa HTML dokument (kliknuvi na link ili koristei opcije iz WWW itaa, poput dugmadi Forward ili Back), OnUnload dogaaj aktivirae dovidjenja() funkciju.

Dogaaji uzrokovani akcijama mia


Dogaaji uzrokovani akcijama mia zahtevaju akciju korisnika (rad sa miem) da bi se aktivirali. Ovo su dogaaji koji se esto koriste.

OnClick
Najee korieni dogaaj uzrokovan akcijom mia je OnClick. Ovaj dogaaj se aktivira uvek kada korisnik klikne na objekat koji prihvata takav dogaaj. Objekti koji prihvataju OnClick dogaaj su linkovi, check box-ovi i dugmad (ukljuujui submit, reset i radio buttons).

21

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

U primeru 8 je dat primer jednostavne forme koja odgovara na kliktaj jedne od komponenti forme.
Primer 8 Primer upotrebe dogaaja OnClick

<html> <head> <title>Primer za OnClick</title> <script language="JavaScript"> <!-function ziv_sam(){ window.alert("Aktiviran je onClick dogadjaj!"); } // --> </script> </head> <body> <h2>onClick</h2> <hr> <a href="javascript:ziv_sam()">Standardni link</a> <form method="POST" enctype=application/x-www-form-urlencoded> <input name="radio1" type="RADIO" OnClick="ziv_sam()">Radio Button<br> <input name="checkbox1" type="CHECKBOX" OnClick="ziv_sam()"> CheckBox<br> <input name="button1" type="BUTTON" OnClick="ziv_sam()" value="Standardno dugme"><br> <input type="RESET" OnClick="ziv_sam()"><br> <input type="SUBMIT" OnClick="ziv_sam()"><br> </form> </body> </html>

22

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Primetite da se OnClick dogaaj koristi na ulaznom polju forme. Prozor sa porukom se aktivira svaki put kada korisnik klikne na stanradno dugme, rese, submit dugmad, radio dugmad, checkbox.

OnFocus
Dogaaj Focus se pojavljuje kada objekat postane predmet u fokusu, ili uproeno reeno doe u centar panje. To se dogaa kada korisnik klikne miem na odreeni objekat, ili tamo doe pritiskajui taster tab. Ako korisnik moe da unese podatke u objekat (ili da promeni trenutni izbor za sluaj lista izbora), tada objekat ima fokus. Obraiva dogaaja OnFocus se koristi samo sa objektima text, textarea, password i select. U primeru 9 prikazujemo upotrebu dogaaja OnFocus sa jednostavnom formom koju ine ulazna polja Ime i Prezime. Dogaaj OnFocus je povezan da poljem Prezime i prikazuje prozor sa porukom kada korisnik ue u to polje. Kako to izgleda u Netscape Navigatoru 3.0 moete videti na slici 7.
Primer 9 Primer upotrebe dogaaja OnFocus

<html> <title>Primer upotrebe dogaaja OnFocus</title> <head> <script language="JavaScript"> <!-function ima_fokus(){ window.alert("'Prezime' je u fokusu."); } // --> </script> </head> <body> <h2>OnFocus</h2> <hr> <form method="POST" enctype=application/x-www-form-urlencoded> Ime: <input name="tekst1" type="TEXT"> Prezime: <input name="tekst2" type="TEXT" OnFocus="ima_fokus()"> </form> </body> </html>

23

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Prozor sa porukom se pojavljuje kada polje Prezime doe u fokus. Primetite da se obraiva dogaaja OnFocus nalazi u <input> oznaci za polje tekst2. Kada objekt dobije fokus, aktivirae se funkcija ima_fokus()

OnBlur
Dogaaj Blur se pojavljuje kada objekt nije vie u fokusu. To se moe desiti sa prebacivanjem u drugi prozor ili aplikaciju, ili tako to kliknemom miem na drugi objekt, ili to pomerimo fokus pritiskom na taster tab. Obraiva dogaaja OnBlur se koristi samo sa objektima text, textarea, password i select, ba kao i OnFocus.
Primer 10 Primer upotrebe dogaaja OnBlur

<html> <title>Primer upotrebe dogaaja OnBlur</title> <head> <script language="JavaScript"> <!-function dodaj(){ document.forma1.puno.value = (document.forma1.ime.value document.forma1.prezime.value); } // --> </script> </head> <body> <h2>OnBlur</h2> <hr> <form name="forma1" method="POST" enctype=application/x-www-form-urlencoded> Ime: <input name="ime" type="TEXT" OnBlur="dodaj()"><br>

"

"

24

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Prezime: <input name="prezime" type="TEXT" OnBlur="dodaj()"><br> <hr> Puno ime: <input name="puno" type="TEXT"> </form> </body> </html> U primeru 10 da bi ste formirali puno ime, potrebno je da unesete ime i prezime. Po unosu bilo imena, bilo prezimena, kada pomerite fokus na drugi objekat, promenie se sadraj polja Puno ime,.

OnChange Dogaaj OnChange se aktivira uvek kada objekat izgubi fokus i ako se njegova vrednost promenila. Obraiva dogaaja OnChange se koristi samo sa objektima text, textarea, password i
select.

OnChange moe biti veoma koristan kada elite da izraunate sumu unetih vrednosti na primer, ili kada na osnovu unetih podataka elite da date profakturu za neku robu, na primer.
Primer 11 Primer upotrebe dogaaja OnChange

<html> <head> <script language="JavaScript"> <!-function kalkulacija(){ window.alert("Izraunavanje podataka."); document.imena.total.value = document.imena.ime1.value + " document.imena.ime2.value + " " + document.imena.ime3.value } // --> </script> </head>

"

25

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

<body> <h3>OnChange</h3> <form name="imena" method="POST" enctype=application/x-www-formurlencoded> Ime: <input name="ime1" type="TEXT" size="10,1" OnChange="kalkulacija()"> <br> Srednje ime: <input name="ime2" type="TEXT" size="10,1" OnChange="kalkulacija()"> <br> Prezime: <input name="ime3" type="TEXT" size="10,1" OnChange="kalkulacija()"> <br> <hr> Total: <input name="total" type="TEXT" size="35,1"> </form> </body> </html>

Uvek kada se test promeni u jednom od ulaznih polja, OnChange dogaaj uzrokuje da se pokrene funcija kalkulacija() koja izrauna puno ime korisnika i upie ga u polje total.

OnSelect Dogaaj OnSelect se odnosi samo na text, textarea i password objekte i izvrava se kada korisnik oznai deo teksta u jednom od nabrojanih tipova objekata. Sintaksa bi mu bila: <input name="mojobjekt" Type="TEXT" OnSelect="funkcija()">

OnSubmit Dogaaj OnSubmit je povezan sa objektom forme. Najee je potrebno da se podaci uneti u polja forme, provere ili iskoriste pre prosleivanja sadraja forme HTTP serveru. Na taj nain, mogue je smanjiti optereenje samog HTTP servera, poto se provera greki vri na strani klijenta, te je redukovan broj izvetaja o greki koje vraa server, da se samo vreme obrade greki ni ne rauna. OnSubmit omoguava da se zaustavi prosleivanje sadraja forme, ako je to neophodno. Prihvata povratnu informaciju kao parametar. Ako JavaScript funkcija vrati vrednost false, sadraj forme nee biti prosleen HTTP serveru.
Primer 12 Primer upotrebe dogaaja OnSubmit

<html> <head> <script language="JavaScript"> <!-function proveri(){

26

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

if (document.num_form.num1.value.length == 10) { window.alert("Hvala to ste uneli samo 10 karaktera."); return true; } else { window.alert("Unesite samo 10 karaktera, molim Vas."); return false; } } // --> </script> </head> <body> <h3>OnSubmit</h3> <hr> <form name="num_form" method="POST" enctype=application/x-www-form-urlencoded OnSubmit="return proveri(this)"> Unesite ime od pet karaktera: <input name="num1" type="TEXT" size="10,1"> <br><hr> <INPUT TYPE=SUBMIT value="Poalji podatke!"> </form> </body> </html> U ovom primeru proveravamo samo osnovne vrednosti, duinu unetih podataka. Koristei String metode moemo uraditi mnogo sloenije provere sadraja polja forme pre njenog slanja. Ako unete vrednosti u polje ne bi zadovoljili proveru, sadraj polja nee biti prosleen HTTP serveru. Primetite da je u primeru koriena naredba this. Ona se odnosi na tekui objekat i bie detaljnije objanjena u poglavlju Objekti u JavaScriptu.

OnMouseOver

OnMouseOver dogaaj ne zahteva da se klikne miem na neki objekat da bi se aktivirao. Kada je pointer mia iznad nekog objekta, dogaaj je okinut. OnMouseOver se moe upotrebiti za objanjenje linkova ili dugmadi. Pogledajte kako u primeru 13. OnMouseOver dogaaj menja tekst u prozoru dobijenom primenom metoda alert().
Primer 13 Primer upotrebe dogaaja OnMouseOver

<html> <head> <script language="JavaScript"> <!-function objasni1(){ window.alert("Ovo je link ka EUnet Jugoslaviji."); } function objasni2(){ window.alert("Ovo je link ka matinoj strani Mikroraunara."); } // --> </script> </head> <body> <h3>OnMouseOver</h3> <hr> <a href="http://www.EUnet.yu" OnMouseOver="objasni1()"> EUnet Jugoslavija</a><br><br>

27

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

<a href="http://www. Mikroracunara.co.yu" OnMouseOver="objasni2()"> Mikroraunara </a><br><br> </body> </html> Zavisno od toga preko kog linka preemo miem, prozor upozorenja e prikazati drugaiji podatak.
OnMouseOut

OnMouseOut dogaaj ne zahteva da se klikne miem na neki objekat da bi se aktivirao. Kada pointer mia izae iz podruja nekog objekta, dogaaj je okinut. OnMouseOut se esto koristi u sprezi sa dogaajem OnMouseOver.
Primer 14 Primer upotrebe dogaaja OnMouseOut

<html> <head> <script language="JavaScript"> <!-function objasni1(){ window.status("Ovo je link ka EUnet Jugoslaviji."); } function objasni2(){ window.status("Ovo je link ka matinoj strani Mikroraunara."); } function izadji(){ window.status(""); } // --> </script> </head> <body> <h3>OnMouseOut</h3> <hr> <a href="http://www.EUnet.yu" OnMouseOver="objasni1()" OnMouseOut="izadji()"> EUnet Jugoslavija</a><br><br> <a href="http://www.Mikroracunara.co.yu" OnMouseOver="objasni2()" OnMouseOut="izadji()"> Mikroraunari</a><br><br> </body> </html>

Objekti u JavaScriptu
Objektno orijentisano programiranje (eng. Object Oriented Programming, skraeno OOP) je, u osnovi, stil programiranjakod koga su povezani koncepti grupisani zajedno. Ukoliko imate, recimo, pet podataka i tri funkcije koje manipuliu nad tim podacima, tada te podatke i funkcije grupiete zajedno u generiki kontejner poznat pod imenom objekt. JavaScript takoe podrava objekte. Objekti sadre podatke, osobine objekta (eng. properties), koji su JavaScript promenljive. Funkcije objekta su poznate kao metodi objekta (eng. methods).

28

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

JavaScript ima takoe odreen broj ugraenih funkcija. Takoe, skoro svaki HTML element je dodeljen nekom JavaScript objektu. Ti objekti su razvrstani u logikoj hijerarhiji koja ima oblik stabla direktorijuma. Programer takoe moe definisati svoje objekte.

Objekti i osobine
JavaScript objekt ima osobine koje mu pripadaju. Njima moete pristupiti preko sledeeg modela: NazivObjekta.NazivOsobine I u nazivu objekta i nazivu osobine objekta razlikujemo mala i velika slova. Osobinu objekta definiemo tako to joj dodelimo vrednost. Na primer, pretpostavimo da imamo objekat po imenu Gradjanin (nain kreiranja objekata bie objanjen malo kasnije, sada samo pretpostavite da objekat ve postoji). Objektu Gradjanin moete dodeliti osobine pod nazivima ime, ime_roditelja, prezime i maticni_broj na sledei nain: Gradjanin.ime=Pera; Gradjanin.ime_roditelja=Peroljub; Gradjanin.prezime=Peri; Gradjanin.maticni_broj=0311937710191; Ovo nije jedini nain pristupa osobinama objekta. Nizovi su skup vrednosti organizovan po brojevima kome je dodeljeno jedno ime promenljive. Osobine objekta i nizovi su u JavaScriptu direktno povezani, oni zapravo predstavljaju razliit nain pristupa istoj strukturi podataka. Tako, na primer, osobinama objekta Gradjanin moete pristupiti i na sledei nain, potpuno ekvivalentan prethodnom primeru: Gradjanin[ime]=Pera; Gradjanin[ime_roditelja]=Peroljub; Gradjanin[prezime]=Peri; Gradjanin[maticni_broj]=0311937710191; Takoe je mogue prii svakoj od osobina niza i preko indeksa. Tako je potpuno ekvivalentno gornjim nainima ekvivalentan i pristup preko indeksa: Gradjanin[0]=Pera; Gradjanin[1]=Peroljub; Gradjanin[2]=Peri; Gradjanin[3]=0311937710191; Ovakav tip niza je poznat pod nazivom asocijativni niz, poto je svakom indeksu niza dodeljen i tekstualni podatak.

Objeti i metodi

29

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Metod je funkcija pridruena objektu. Programer definie metod na isti nain kao to definie funkciju. Potom tu funkciju pridrui objektu na sledei nain: NazivObjekta.NazivMetoda = NazivFunkcije gde je NazivObjekta postojei objekat, NazivMetoda je naziv koji dodeljujemo metodu, a NazivFunkcije je naziv funkcoje koju povezujemo sa objektom. Potom moemo pozivati metod u kontekstu objekta kao: NazivObjekta.NazivMetoda(parametri);

This
JavaScript ima specijalnu rezervisanu re, this, koja se koristi za referenciranje na trenutni objekt. Na primer, pretpostavimo da imamo funkciju Proveri() koja proverava da li se vrednost osobine objekta nalazi u propisanim granicama: function Poveri(obj, donja, gornja){ if((obj.value < donja)||(obj.value > gornja)) alert(Pogrena vrednost) } Tada moemo pozvati funkciju Proveri() u svakom elementu forme na obraiva dogaaja OnChange, koristei this da prosledimo element forme, kao u sledeem primeru:
<INPUT TYPE=text NAME=godine SIZE=3 OnChange=Proveri(this,18,77)>

Kreiranje novog objekta


JavaScript ima odreeni broj ugraenih objekata (o kojima e malo kasnije biti vie rei), ali programer moe kreirati svoje sopstvene objekte. Kreiranje objekta se odvija u dva koraka: 1.Definisanje tipa objekta preko pisanja funkcije, 2.Kreirajui instancu objekta sa new. Da bi definisali tip objekta moramo napisati funkciju koja odreuje njegovo ime, njegove osobine i metode. Na primer, pretpostavimo da elimo da kreiramo tip objekta za graanine, koji smo ve koristili na poetku dela Objekti u JavaScriptu. Neka se objekat zove osoba i neka ima osobine Ime, Srednje_ime, Prezime i Maticni_broj. Da bi to uradili potrebno je da napiete sledeu funkciju: function osoba(ime, srednje_ime, prezime, MatBroj) { this.ime=ime; this.ime_roditelja = srednje_ime; this.prezime=prezime; this.maticni_broj=MatBroj; } Sada moemo da kreiramo objekat osoba1 pozivajui funkciju osoba preko new:

30

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

osoba1=new osoba(Pera, Peroljub,Peri, 0311937710191); Objektu moemo da dodamo i metode. Prvo emo napisati funkciju koju elimo da dodamo objektu. Recimo, funkcija prikaziProfil() koja ispisuje sve podatke o osobi: function prikaziProfil() { document.write("Ime: " + this.ime + "<BR>"); document.write("Srednje ime: " + this.ime_roditelja + "<BR>"); document.write("Prezime: " + this.prezime + "<BR>"); document.write("Matini broj: " + this.maticni_broj + "<BR>"); } Sada emo ponovo napisati funkciju osoba() preko koje definiemo objekt. function osoba(ime, srednje_ime, prezime, MatBroj) { this.ime=ime; this.ime_roditelja = srednje_ime; this.prezime=prezime; this.maticni_broj=MatBroj; this.prikaziProfil=prikaziProfil; } Kada definiemo objekat osoba1, funkciji prikaziProfil() se pristupa preko: osoba1.prikaziProfil();

Objekat moe da ima osobinu koja je sama objekat. Na primer, objekat tipa osoba, moe u sebe ukljuivati osobine otac i majka, koje su i same objekat. I tako redom.
Primer 14 Primer upotrebe korisnikih objekata u JavaScriptu <HTML> <HEAD> <TITLE>Primer 14</TITLE> <SCRIPT LANGUAGE="JavaScript"> <!-//Definicija metoda function prikaziPodatke() { document.write("<H1>Profil zaposlenog: " + this.ime + "</H1><HR><PRE>"); document.writeln("Broj zaposlenog: " + this.broj); document.writeln("Matini broj: " + this.matbroj); document.writeln("Trenutna plata: " + this.plata); document.write("</PRE>"); } //Definicija objekta function zaposleni() { this.ime=prompt("Unesite ime zaposlenog","Ime"); this.broj=prompt("Unesite broj radnika za " + this.ime,"000-000"); this.matbroj=prompt("Unesite matini broj za " + this.ime,"0000000000000"); this.plata=prompt("Unesi trenutnu platu za" + this.ime,"$00,000"); this.prikaziPodatke=prikaziPodatke; } noviZaposleni=new zaposleni(); // --> </SCRIPT> </HEAD> <BODY> <SCRIPT LANGUAGE="JavaScript"> <!--

31

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

noviZaposleni.prikaziPodatke(); // --> </SCRIPT> </BODY> </HTML>

Ugraeni objekti JavaScripta


JavaScript jezik sadri sledee ugraene objekte: anchor button checkbox Date document elements array form (forms array) frame (frames array) hidden history link (links array) location Math navigator password radio reset select (options array) string submit text textarea window

Ti objekti i njihove osobine i metodi su ugraeni u jezik. Programeri mogu pristupati tim objektima. Ugraeni objekti imaju osobine i metode.

Kreiranje nizova u JavaScriptu


JavaScript nema zapravo niz kao eksplicitan tip podataka, ali zbog veze izme]u nizova i osobina objekata o kojoj je ve pre bilo rei, veoma je lako kreirati objekte u JavaScriptu. Programer moe da definie niz kao objekat, na sledei nain: function NapraviNiz(n) { this.duzina=n; for(var i=1;i<=n;i++){ this[i]=0;} return this; } ova funkcija definie niz tako da prva osobina, duzina (indeks nula), predstavlja broj elemenata niza. Preostale osobine imaju celobrojni indeks, od jedan pa vie. Moete zatim kreirati niz tako to ga pozovete, kao u sledeem primeru, odreujui broj lanova niza: niz1= new NapraviNiz(10); ovo kreira niz niz1 sa 10 elemenata i inicijalizuje ih sve na nulu.

Referentni pregled objekata JavaScripta

32

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

anchor
Pogledajte anchors osobinu document objekta.

button
Objekat button se u JavaScriptu odnosi na dugme push iz HTML forme.

Osobine
name value Sadri naziv button elementa. Sadri vrednost button elementa.

Metodi
click() Emulira akciju kliktanja miem na dugme.

Obraivai dogaaja
onClick Odreuje JavaScript kod koji e se izvriti kada bude kliknuto na dugme.

checkbox
Objekat checkbox omoguava da na nam check box element HTML forme bude dostupan iz JavaScripta.

Osobine
checked defaultChecked name value Boolean vrednost koja ukazuje da li je check box element ukljuen. Boolean vrednost koja ukazuje da li je predloeno stanje check box elementa da je ukljuen (odnosi se na CHECKED atribut). Sadri naziv check box elementa. Sadri vrednost check box elementa.

Metodi
click() Emulira akciju kliktanja miem na check box.

33

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Obraivai dogaaja
onClick Odreuje JavaScript kod koji e se izvriti kada bude kliknuto na check box.

Date
Objekat Date daje mehanizam za rad sa datumima i vremenom u JavaScript. Instance objekta se mogu kreirati sa noviDatum = new Date(PodaciODatumu) u ovom primeru, PodaciODatumu su opciona specifikacija odreenog datuma i moe biti u sledeim oblicima: mesec dan, godina as:minut:sekunda godina, mesec, dan godina, mesec, dan, as, minut, sekunda U sluaju da PodaciODatumu nisu specificirani, novi objekt e biti predstavljen sa trenutnim datumom i vremenom.

Metodi
getDate() getDay() getHours() getMinutes() getMonth() getSeconds() getTime() getTimezoneOffset() getYear() parse(dateString) Vraa dan u mesecu za trenutni Date objekt kao celobrojni broj od 1 do 31. Vraa dan u nedelji za trenutni Date objekt kao celobrojni broj od 0 do 6 (gde je 0 nedelja, 1 je ponedeljak i tako redom). Vraa sat iz vremena za trenutni Date objekt kao celobrojni broj od 0 do 23. Vraa minute iz vremena za trenutni Date objekt kao celobrojni broj od 0 do 59. Vraa mesec iz datuma za trenutni Date objekt kao celobrojni broj od 0 do 11 (gde je 0 januar, 1 je februar i tako redom). Vraa sekunde iz vremena za trenutni Date objekt kao celobrojni broj od 0 do 59. Vraa vreme iz trenutnog Date objekta kao celobrojni broj koji predstavlja broj milisekundi proteklih od 1 januara 1970. godine od 00:00:00. Vraa razliku izmeu lokalnog vremena i Grinia (GMT) kao celobrojni broj, koji predstavlja broj minuta. Predstavlja godinu iz trenutnog Date objekta kao dvocifarski celobrojni broj koji predstavlja godinu minus 1900. Vraa broj milisekundi izmeu 1. januara 1970. godine u 00:00:00 i vremena specificiranog u dateString. dateString moe da uzme format Day, DD Mon YYYY HH:MM:SS TZN Mon DD, YYYY Postavlja dan u mesecu u trenutni Date objekt. dateValue je celobrojni broj izmeu 1 i 31. Postavlja sat u vreme trenutnog Date objekta. hoursValue je celobrojni broj izmeu 0 i 23. Postavlja minute u vreme trenutnog Date objekta. minutesValue je celobrojni broj izmeu 0 i 59.

setDate(dateValue) setHours(hoursValue) setMinutes(minutesValue)

34

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

setMonth(monthValue) setSeconds(secondsValue) setTime(timeValue) setYear(yearValue) toGMTString()

Postavlja mesec za trenutni Date objekt. monthValue je celobrojni broj izmeu 0 i 11 (gde je 0 januar, 1 je februar i tako redom). Postavlja sekunde u vreme za trenutni Date objekt. secondsValue je celobrojni broj izmeu 0 i 59. Postavlja vrednost u vreme za trenutni Date objekt. timeValue je celobrojni broj koji predstavlja broj milisekundi izmeu 1. januara 1970. godine u 00:00:00. Postavlja godine za trenutni Date objekt. yearValue is je celobrojni broj vei od 1900. Vraa vrednost trenutnog Date objekta u vremenu Grinia (GMT) kao string, koristei Internet konvenciju u sledeoj formi: Day, DD Mon YYYY HH:MM:SS GMT Vraa vrednost trenutnog Date objekta u lokalnom vremenu koristei lokalne konvencije. Vraa broj milisekundi proteklih od 1. januara 1970. godine u 00:00:00 o Griniu (GMT).
yearValue je celobrojna vrednost vea od 1900. monthValue je celobrojna vrednost izmeu 0 i 11. dateValue je celobrojna vrednost izmeu 1 i 31. hoursValue je celobrojna vrednost izmeu 0 i 23. minutesValue i secondsValue je celobrojna vrednost

toLocaleString() UTC(yearValue, monthValue, dateValue, hoursValue, minutesValue, secondsValue)

izmeu 0 i 59.

hoursValue, minutesValue i secondsValue su opcioni.

document
Objekt document omoguuje rad sa atributima HTML dokumenta u JavaScriptu.

Osobine
alinkColor anchors bgColor cookie fgColor forms Boja aktivnog linka kao string ili heksadecimalni triplet. Niz anchor objekata po redu pojavljivanja u HTML dokumentu. Koristite anchors.length da dobijete broj linkova (anchors) u dokumentu. Boja pozadine dokumenta. Sadri cookie vrednost za trenutni dokument dokument. Boja prednje strane dokumenta (foreground). Niz objekata formi u redu pojavljivanja formi u HTML dokumentu. Koristite forms.length da dobijete broj formi u dokumentu. Sadri datum posledenje modifikacije dokumenta. Boja linkova kao string ili heksadecimalni triplet. Niz objekata veza (links) u redu pojavljivanja veza u HTML dokumentu. Koristite links.length da dobijete broj veza u dokumentu. Linkovi i anchor objekti nisu jedno isto! Sadri URL trenutnog dokumenta. Sadri URL dokumenta iz koga je pozvan trenutni dokument, kada korisnik sledi link. Sadri naslov trenutnog dokumenta. Boja poseenih linkova kao string ili heksadecimalni triplet.

lastModified linkColor links location referrer title vlinkColor

35

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Metodi
clear() close() open(mimeType) Brie prozor za prikaz dokumenta. Zatvara trenutni ispis u prozor. Otvara upis u prozor, dozvoljavajui write() i writeln() metode za upis u prozor dokumenta. mimeType je opcioni string koji odreuje tip dokumenta podran od strane WWW itaa ili plug-in (na primer, text/html, image/gif i tako redom). Ispisuje tekst i HTML kod u dokument. Ispisuje tekst i HTML kod u dokument praeno znakom za novi red.

write() writeln()

form
Objekat form omoguava rad sa HTML formama iz JavaScripta. Svaka HTML forma u dokumentuje predstavljena razliitim pojavljivanje form objekta.

Osobine
action elements encoding method target Sadri URL na koju se prosleuje sadraj (podaci) forme. Niz objekata za svaki element forme u redosledu pojavljivanje u formi. Sadri MIME kodiranje za formu koje je dodeljeno ENCTYPE atributu forme. Sadri metod prenosa podataka iz forme serveru. Sadri naziv prozora WWW itaa za koji su odgovori na prosleivanje podataka iz forme upueni.

Metodi
submit() Prosleuje sadraj forme. Simulira dogaaj OnSubmit.

Obraivai dogaaja
onSubmit . Odreuje JavaScript kod koji se izvrava neposredno pre slanja sadraja forme. Moe da se vrati true, to dozvoljava da se sadraj forme prosledi. Ako je vraeno false, spreava se slanje sadraja forme.

frame
Objekat frame omoguava rad sa HTML okvirima iz JavaScripta.

36

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Osobine
frames . parent self top window Niz objekata, svaki lan niza je po jedan okvir u prozoru. Okviri su u nizu u redosledu pojavljivanja u izvornom kodu HTML dokumenta. Sadri naziv prozora koji sadri definiciju okvira (frameset). Alternetiva za naziv trenutnog prozora. Alternetiva za naziv top-most prozora. Alternetiva za naziv trenutnog prozora.

Metodi
alert close confirm(message) open(url,name,features) Prikazuje poruku u dijalog prozoru. Zatvara prozor. Prikazuje poruku u dijalog prozoru sa OK i CANCEL dugmadima. Vraa true odnosno false zavisno od toga koje je dugme pritisnuto. Otvara HTML dokument sa URL-a u prozoru iji je naziv dat (name). Ako name ne postoji, otvara se novi prozor sa tim imenom. features je opcioni argument koji sadri a listu osobina novog prozora. List osobina sadri ma koji od sledeih parova naziv/vrednost odvojenih zarezima i bez dodatnih praznih mesta izmeu: toolbar=[yes,no,1,0]: ukazuje da li prozor treba da ima toolbar. location=[yes,no,1,0]: ukazuje da li prozor treba da ima polje za prikazivanje trenutnog URL-a. directories=[yes,no,1,0]: ukazuje da li prozor treba da ima dugmad direktorijuma. status=[yes,no,1,0]: ukazuje da li prozor treba da ima status bar. menubar=[yes,no,1,0]: ukazuje da li prozor treba da ima menije. scrollbars=[yes,no,1,0]: ukazuje da li prozor treba da ima klizae prozora (scroll bars). resizable=[yes,no,1,0]: ukazuje da li prozor treba da moe da promeni veliinu. width=pixels: daje irinu prozora u pikselima. height=pixels: daje visinu prozora u pikselima. Prikazuje poruku (message) u dijalog prozoru sa ulaznim tekst poljem sa predloenom vrednou odgovora (response). Korisnikov odgovor je sadraj tekst ulaznog polja koje se vraa kao string. Izvrava narednu posle odreenog vremena, izraenog u milisekundama i sadranog u time. Izlaz moe da bude sledeeg oblika structure: name = setTimeOut(expression,time) Prekida broja sa datim imenom.

prompt(message,response)

setTimeout(expression,time)

clearTimeout(name) .

37

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

hidden
Objekat hidden se odnosi na rad sa sakrivenim (hidden) poljem u HTML formi iz JavaScripta.

Osobine
name value Sadri naziv hidden elementa. Sadri vrednost hidden elementa.

history
Objekat history omoguava skriptu da radi sa listom poseenih lokacija (history list) WWW itaa iz JavaScripta. Iz razloga bezbednosti i privatnosti, stvaran sadraj liste nije dostupan iz JavaScripta.

Osobine
length An integer representing the number of items on the history list.

Metodi
back() forward go(location) Vraa se nazad na prethodni dokument u history listi. Idemo napred na sledei dokument u history listi. Idemo na dokument u history listi odreen sa location. location moe biti string ili celobrojna vrednost. Ako je string, onda predstavlja deo ili celi URL iz history liste. Ako je celobrojna vrednost, location predstavlja relativnu poziciju dokumenta u history listi. Kao celobrojna vrednost, location moe biti pozitivan ili negativan.

link
Objekat link odnosi se na hipertekst link u telu HTML dokumenta.

Osobine
. target Sadri naziv prozora ili okvira odreenog u TARGET atributu.

Obraiva dogaaja
onClick onMouseOver Odreuje JavaScript kod koji e se izvriti kada bude kliknuto na link. Odreuje JavaScript kod koji e se izvriti kada mi pree preko hipertekst linka.

38

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

location
Objekat location se odnosi na informacije o trenutnom URL-u.

Osobine
hash host hostname href pathname port protocol search Sadri anchor naziv u URL-u. Sadri naziv raunara i broja porta iz URL-a. Sadri adresu raunara (ili numeriku IP adresu) iz URL-a. A Sadri ceo URL. Sadri putanju iz URL-a. Sadri broj porta iz URL-a. Sadri protokol iz URL-a (ukljuujui i dvotaku, ali ne i crtu). Sadri informacije koje se prosleuju pri GET CGI-BIN pozivu (sve informacije posle znaka pitanja).

Math
Objekat Math obezbeuje osobine i metode za napredna matematika izraunavanja.

Osobine
E LN10 LN2 PI SQRT1_2 SQRT2 Vrednost Ojlerove konstante (priblino 2,718) koja se koristi kao baza prirodnih algoritama. Vrednost prirodnog algoritma od 10 (priblino 2,302). Vrednost prirodnog algoritma od 2 (priblino 0,693). Vrednost PI (priblino 3,1415). Vrednost kvadratnog korena od jedne polovine (priblino 0,707). Vrednost kvadratnog korena od dva (priblino 1,414).

Metodi
abs(number) acos(number) asin(number) atan(number) ceil(number) Vraa apsolutnu vrednost broja. Vraa vrednost arkus kosinu broja u radijanima. Vraa vrednost arkus sinus broja u radijanima. Vraa vrednost arkus tangens broja u radijanima.. Vraa sledei celobrojni broj vei od navedenog broja. Drugim reima, vri se zaokruivanje broja na sledei celobrojni broj. Vraa kosinus ugla koji je dat u radijanima. Vraa vrednost eksponenta datog broja. Vraa prethodni celobrojni broj manji od navedenog broja. Drugim reima, vri se zaokruivanje broja na prethodni celobrojni broj. Vraa se prirodni logaritam datog broja. Vraa vei broj od dva data.

cos(number) exp(number) floor(number) log(number) max(number1,number2)

39

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

min(number1,number2) pow(number1,number2) random() round(number) sin(number) sqrt(number) tan(number)

Vraa manji broj od dva data. Vraa vrednost number1 dignut na number2. Vraa sluajan broj izmeu nule i jedan. Vraa najblii celi broj. Vraa sinus ugla koji je dat u radijanima. Vraa kvadratni koren broja. Vraa tangens ugla koji je dat u radijanima.

navigator
Objekat navigator se odnosi na informacije o WWW itau koji se koristi.

Osobine
appCodeName appName appVersion userAgent Sadri kodni naziv klijenta (na primer, Mozilla za Netscape Navigator). Sadri naziv klijenta (na primer, Netscape za Netscape Navigator). Sadri informaciju o verziji klijenta u formi versionNumber (platforma; zemlja). Na primer, Navigator 2.0, beta 6 za Windows 95 (meunarodna verzija), ima appVersion osobinu 2.0b6 (Win32; I). Sadri kompletnu vrednost user-agent zaglavlja poslatog u HTTP zahtevu. Sadri sve informacije koje se nalze i u appCodeName i appVersion: na primer, Mozilla/2.0b6 (Win32; I)

password
Objekat password odnosi se na pristup tekst polju sa lozinkom HTML forme iz JavaScripta.

Osobine
defaultValue name value Sadri predloenu vrednost za password element (odnosno vrednost njegovog VALUE atributa). Sadri naziv password tekst polja forme. Sadri vrednost password tekst polja forme.

Metodi
focus() blur() select() Emulira akciju fokusiranja na textarea polje. Emulira akciju uklanjanja fokusa sa textarea polja. Emulira akciju selektovanja teksta u textarea polju.

40

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

radio
The radio object reflects a set of radio buttons from an HTML form in JavaScript. To access individual radio buttons, use numeric indexes starting at zero. For instance, individual buttons in a set of radio buttons named testRadio could be referenced by testRadio[0], testRadio[1], and so on.

Osobine
checked defaultChecked length name value Boolean vrednost koja ukazuje da li je odreeno dugme ukljueno. Moe se koristiti za selektovanje ili deselektovanje dugmeta. Boolean vrednost koja ukazuje da li je predloeno stanje odreenog dugmeta da je ukljuen (odnosi se na CHECKED atribut). Celobrojna vrednost koja ukazuje na broj radio dugmadi u skupu. Sadri naziv skup radio buttons elemenata. Sadri vrednost radio dugmeta u skupu (odnosno VALUE atributa).

Metodi
click() Emulira akciju kliktanja miem na radio dugme.

Obraivai dogaaja
onClick . Odreuje JavaScript kod koji e se izvriti kada bude kliknuto na radio button.

reset
Objekat reset se koristi za rad sa reset dugmetom u HTML formi iz JavaScripta.

Osobine
name value Sadri naziv reset dugmeta. Sadri vrednost reset dugmeta (tekst koji se ispisuje na reset dugmetu).

Metodi
click() Emulira akciju kliktanja miem na reset dugme.

41

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Obraivai dogaaja
onClick Odreuje JavaScript kod koji e se izvriti kada bude kliknuto na reset dugme.

select
Objekat select se odnosi na rad sa selekcionim listama u HTML formi iz JavaScripta.

Osobine
length name options Sadri celobrojnu vrednost koja predstavlja broj opcija u listi izbora. Sadri naziv izbora sa liste. Niz iji su elementi svaka od opcija sa liste izbora poredu pojavljivanja u listi. Ova osobina ima svoje sopstvene osobine: defaultSelected: Boolean vrednost koja ukazuje koja od opcija je predloena (odnosno odraava se SELECTED atribut). index: Celobrojna vrednost koja oznaava indeks opcije. length: Beoj opcija u listi izbora name: Sadri naziv liste izbora. options: Sadri puni HTML kod za listu izbora selected: Boolean vrednost koja ukazuje da li je opcija izabrana. Moe da se koristi za selekciju ili deselekciju opcije. selectedIndex: Celobrojna vrednost koja predstavlja indeks trenutno izabrane opcije. text: Sadri tekst koji se prikazuje u listi izbora za odreenu opciju. value: Sadri vrednost unetu za specificiranu opciju (odraava VALUE atribut). Odraava indeks trenutno izabrane opcije u listi izbora.

selectedIndex

Obraivai dogaaja
onBlur onFocus onChange Odreuje JavaScript kod koji se izvrava kada lista izbora izgubi fokus. Odreuje JavaScript kod koji se izvrava kada lista izbora dobije fokus. Odreuje JavaScript kod koji se izvrava kada se selektovana opcija promeni.

string
Objekat string daje osobine i metode za rad sa string konstantama i promenljivima.

Osobine
length Celobrojna vrednost koja sadri broj karaktera u stringu.

42

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Metodi
anchor(name) big() blink() bold() charAt(index) fixed() fontColor(color) fontSize(size) indexOf (findString,startingIndex) Vraa string koji sadri vrednost string objekta okruenog sa A oznakom sa NAME atributom. Vraa string koji sadri vrednost string objekta okruenog sa BIG oznakom. Vraa string koji sadri vrednost string objekta okruenog sa BLINK oznakom. Vraa string koji sadri vrednost string objekta okruenog sa B oznakom. Vraa karakter sa lokacije odreene indeksom. Vraa string koji sadri vrednost string objekta okruenog sa FIXED oznakom. Vraa string koji sadri vrednost string objekta okruenog sa FONT oznakom sa COLOR atributom koji postavlja boju, gde je color naziv boje ili RGB triplet. Vraa string koji sadri vrednost string objekta okruenog sa FONTSIZE oznakom sa veliinom na koju je postavljen. Vraa mesto prvog pojavljivanja findString, koji poinje da pretrauje string od mesta odreenog sa startingIndex gde je to samo opcija, ukoliko ne postoji, pretraivanje poinje od poetka stringa. Vraa string koji sadri vrednost string objekta okruenog sa I oznakom. Vraa mesto poslednjeg pojavljivanja findString, koji poinje da pretrauje string od mesta odreenog sa startingIndex unazad gde je to samo opcija, ukoliko ne postoji, pretraivanje poinje od kraja stringa. Vraa string koji sadri vrednost string objekta okruenog sa A oznakom sa HREF atributom postavljenim na href. Vraa string koji sadri vrednost string objekta okruenog sa SMALL oznakom. Vraa string koji sadri vrednost string objekta okruenog sa STRIKE oznakom. Vraa string koji sadri vrednost string objekta okruenog sa SUB oznakom. Vraa podstring koji poinje od pozicije firstIndex i koji se zavrava sa jdnim karakterom pre lastIndex. Ako je firstIndex vee od lastIndex, izabrani podstring poinje od lastIndex i zavrava se karakter pre firstIndex. Vraa string koji sadri vrednost string objekta okruenog sa SUP oznakom. Vraa string koji sadri vrednost string objekta sa svim karakterima konvertovanim u mala slova. Vraa string koji sadri vrednost string objekta sa svim karakterima konvertovanim u velika slova.

italics() lastIndexOf (findString,startingIndex)

link(href) small() strike() sub() substring (firstIndex, lastIndex)

sup() toLowerCase() toUpperCase()

submit
Objekat submit omoguava rad sa submit dugmetom u HTML formi iz JavaScripta.

43

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Osobine
name value Sadri naziv submit dugmeta. Sadri vrednost submit dugmeta, odnosno tekst koji se ispisuje na dugmetu.

Metodi
click() Emulira akciju kliktanja miem na submit dugme.

Obraivai dogaaja
onClick Odreuje JavaScript kod koji e se izvriti kada bude kliknuto na submit dugme.

text
Objekat text omoguava rad sa text poljem HTML forme iz JavaScripta.

Osobine
defaultValue name value Sadri predloenu vrednost za text element (odnosno sadri vrednost VALUE atributa). Sadri naziv text elementa. Sadri vrednost text elementa.

Metodi
focus() blur() select() Emulira akciju fokusiranja na text polje. Emulira akciju uklanjanja fokusa sa text polja. Emulira akciju selektovanja teksta u text polju.

Obraivai dogaaja
onBlur onChange onFocus onSelect Odreuje JavaScript kod koji se izvrava kada polje izgubi fokus. Odreuje JavaScript kod koji se izvrava kada sadraj polja promeni. Odreuje JavaScript kod koji se izvrava kada polje dobije fokus. Odreuje JavaScript kod koji se izvrava kada korisnik selektuje deo ili ceo tekst u polju.

44

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

textarea
Objekat textarea omoguava rad sa vielinijskim tekst poljem u HTML formi iz JavaScripta.

Osobine
defaultValue name value Sadri predloenu vrednost za textarea element (odnosno sadri vrednost VALUE atributa). Sadri naziv textarea elementa. Sadri vrednost textarea elementa.

Metodi
focus() blur() select() Emulira akciju fokusiranja na textarea polje. Emulira akciju uklanjanja fokusa sa textarea polja. Emulira akciju selektovanja teksta u textarea polju.

Obraivai dogaaja
onBlur onChange onFocus onSelect Odreuje JavaScript kod koji se izvrava kada polje izgubi fokus. Odreuje JavaScript kod koji se izvrava kada sadraj polja promeni. Odreuje JavaScript kod koji se izvrava kada polje dobije fokus. Odreuje JavaScript kod koji se izvrava kada korisnik selektuje deo ili ceo tekst u polju.

window
Objekat window je top-level objekat za svaki prozor ili okvir i roditeljski je objekat za document,
location i history objekte.

Osobine
defaultStatus frames length name parent self status Sadri predloenu vrednost prikazanu u status bar-u. Niz objekata, gde jedan element niza odgovara jednom okviru u prozoru. Okviri se pojavljuju u nizu onim redom kojim se pojavljuju u HTML izvornom kodu. Broj okvira u roditeljskom prozoru. Sadri naziv prozora ili okvira. Sadri naziv prozora u kome se nalazi dokument sa definicijom okvira. Alternativa za naziv trenutnog prozora. Koristi se za prikazivanje poruke u status bar-u (u donjem delu WWW itaa je prostor u kome se isposuju poruke pri radu). To se obavlja prostom dodelom vrednosti ovoj osobini. Alternativa za naziv top-most prozora. Alternativa za naziv trenutnog prozora.

top window

45

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

Metodi
alert(message) close() confirm(message) open(url,name,features) Prikazuje poruku u prozoru dijaloga (dialog box). Zatvara prozor. Prikazuje poruku u prozoru dijaloga (dialog box) sa OK i CANCEL dugmadima. Vraa true ili false zavisno od toga na koje je dugme kliknuo korisnik. Otvara dokument sa datog URL-a u prozoru odreenim sa name. Ako name ne postoji, otvara se novi prozor sa tim imenom. features je opcioni argument koji sadri listu osobina za novi prozor. List osobina sadri ma koji od sledeih parova naziv/vrednost odvojenih zarezima i bez dodatnih praznih mesta izmeu: toolbar=[yes,no,1,0]: ukazuje da li prozor treba da ima toolbar. location=[yes,no,1,0]: ukazuje da li prozor treba da ima polje za prikazivanje trenutnog URL-a. directories=[yes,no,1,0]: ukazuje da li prozor treba da ima dugmad direktorijuma. status=[yes,no,1,0]: ukazuje da li prozor treba da ima status bar. menubar=[yes,no,1,0]: ukazuje da li prozor treba da ima menije. scrollbars=[yes,no,1,0]: ukazuje da li prozor treba da ima klizae prozora (scroll bars). resizable=[yes,no,1,0]: ukazuje da li prozor treba da moe da promeni veliinu. width=pixels: daje irinu prozora u pikselima. height=pixels: daje visinu prozora u pikselima. prompt(message,response) Prikazuje poruku (message) u dijalog prozoru sa ulaznim tekst poljem sa predloenom vrednou odgovora (response). Korisnikov odgovor je sadraj tekst ulaznog polja koje se vraa kao string. Izvrava narednu posle odreenog vremena, izraenog u milisekundama i sadranog u time. Izlaz moe da bude sledeeg oblika structure: name = setTimeOut(expression,time) Prekida broja sa datim imenom.

setTimeout(expression,time)

clearTimeout(name)

Obraivai dogaaja
onLoad onUnload Odreuje JavaScript kod koji se izvrava kada se HTML dokument potpuno uita u prozor ili okvir. Odreuje JavaScript kod koji se izvrava kada se naputa trenutni HTML dokument u prozoru ili okviru.

46

Uvod u JavaScript

Sran Panti, srdjan@pantic.co.yu

47

You might also like