61
Web programiranje JavaScript

3 java script

Embed Size (px)

DESCRIPTION

World Wide Web (Web) je svjetska mreža računala s izvorima (engl. resources) digitalne informacije. S obzirom na raznolikost digitalne informacije: tekst, slika, zvuk, video, program i dr. govorimo općenito o izvoru informacije ili WEB dokumentu. WEB programiranje se oslanja na tri mehanizma koja čine ove izvore dostupnima najširoj svjetskoj javnosti: 1. Jedinstvena shema imena za traženje (lociranje) izvora na mreži. 2. Protokoli za pristup informaciji preko WEB-a, kao što je npr. HTTP protokol. Protokoli su skup standardizirane informacije za prijenos digitalnog sadržaja preko mreže. 3. Hipertekst (engl. Hypertext) za jednostavnu navigaciju između informacijskih izvora, kao što je na primjer HTML (hypertext markup language). Svaki izvor informacije na WEB-u (HTML ili XML dokument, slika, video, program i sl.) ima jednoznačnu adresu koja se dekodira preko URI-a (Universal Resource Identifier). URI se sastoji od tri dijela: 1. Protokola pristupa izvoru (npr. http, ftp, mailto i sl.) 2. Imena stroja na kojem se izvor informacije nalazi (npr. www.fsb.hr). 3. Punog imena izvora zadanog stazom (engl. path). URI ima različite uloge: povezivanje mjesta unutar istog dokumenta, povezivanje različitih dokumenata, dohvaćenje slika, objekat

Citation preview

sekcije kod definisan u tagu 5. Primer skripta u datoteci 6. JavaScript Sintaksa slina programskom jeziku Java nije programski jezik Java Nema tipove podataka kod deklaracije promenljivih se ne stavlja tip (interpreter). Nema kreiranja novih klasa ugraene funkcije, ugraeni objekti Sistem dogaaja 7. Pozivanje JavaScript-a Kao reakciju na neki dogaaj. Unutar 8. Promenljive Promenljive sadre informacije Deklaracija promenljivih upotrebom kljune rei var Primer: var a; var b = 5; var c = "Pera"; 9. Promenljive Nakon deklaracije, varijabla se moe inicijalizovati: var x; x = 5; Inicijalizacija moe i uz deklaraciju: var x = 5; Varijabla moe i da promeni tip: var x = 5; x = "Mika"; Js_variables.html 10. Aritmetiki i operatori dodele Aritmetiki: + - * / % ++ -- x = 5; y = x * 4; z = y % 5; Dodele: = += -= *= /= %= y += 5; y=y+5; Operator + ima posebno znaenje kada su operandi stringovi: a = "Pera"; b = "Car"; c = a + b; Kada sabiramo stringove i brojeve, rezultat je string 11. Aritmetiki operatori y = 5; Operator Rezultat x=y+2 x=7 x=y-2 x=3 x=y%2 x=1 x=++y x=6, y=6 x=y++ x=5, y=6 x=--y x=4 12. Operatori dodele x = 10; y = 5; Operator Isto kao Rezultat x=y x=5 x+=y x=x+y x=15 x-=y x=x-y x=5 x*=y x=x*y x=50 x/=y x=x/y x=2 x%=y x=x%y x=0 13. Relacioni operatori Relacioni: == === != < >= x = 5; if (x == 5) document.write("x je jednako 5"); Operator === e porediti i vrednost i tip: if (x === "5") document.write("x je string sa sadrajem 5"); Rezultat relacionih operatora je logika vrednost tano (true) ili netano (false) 14. Relacioni operatori x = 5; Operator Rezultat == x == 8 je netano (false) === x == 5 je tano (true) x == "5" je netano (false) != x != 8 je tano (true) > x > 8 je netano (false) < x < 8 je tano (true) >= x >= 8 je netano (false) 3)?5:6; 18. Kontrola toka if else switch for while do while break continue 19. if else Opta sintaksa: if(uslov_1) telo_1 else if(uslov_2) telo_2 else telo_3 Js_if.html Js_if_else.html 20. Primer if (poeni > 94) ocena = 10; else if (poeni > 84) ocena = 9; else if (poeni > 74) ocena = 8; else if (poeni > 64) ocena = 7; else if (poeni > 54) ocena = 6; else ocena = 5; 21. Primer 22. switch Izraz u switch() izrazu mora da proizvede celobrojnu vrednost. Ako ne proizvodi celobrojnu vrednost, ne moe da se koristi switch(), ve if()! Ako se izostavi break; propae u sledei case. Kod default izraza ne mora break - to se podrazumeva. Js_switch.html 23. Primer switch (a) { case 1: case 2: i = j + 6; break; case 3: i = j + 14; break; default: i = j + 8; } 24. Primer 25. while Za ciklinu strukturu kod koje se samo zna uslov za prekid. Telo ciklusa ne mora ni jednom da se izvri Opta sintaksa: while (uslov) telo Vano: izlaz iz petlje na false! Js_while.html 26. Primer 27. Primer 28. do while Za ciklinu strukturu kod koje se samo zna uslov za prekid Razlika u odnosu na while petlju je u tome to se telo ciklusa izvrava makar jednom. Opta sintaksa: do telo while (uslov); Vano: izlaz iz petlje na false! Js_do_while.html 29. Primer 30. for Za organizaciju petlji kod kojih se unapred zna koliko puta e se izvriti telo ciklusa. Petlja sa poetnom vrednou, uslovom za kraj i blokom za korekciju. Opta sintaksa: for (inicijalizacija; uslov; korekcija) telo Js_for.html Js_for_loop_headers.html 31. for for (i = 0; i < 10; i++) document.write(i + "
"); moe i viestruka inicijalizacija i step-statement: for(i = 0, j = 1; i < 10 && j != 11;i++, j++) oprez (moe da se ne zavri): var x; for (x = 0; x != 10; x+=0.1) ... 32. Primer 33. break i continue break prekida telo tekue cikline strukture (ili case dela) i izlazi iz nje. continue prekida telo tekue cikline strukture i otpoinje sledeu iteraciju petlje. Js_loop*.html 34. break i continue 35. Primer izlaz iz ugnjedene petlje for (...) { for (...) { ... if (uslov) break; } } 36. for ... in petlja Za iteriranje kroz nizove Opta sintaksa: for (promenljiva in niz) { ... } Js_for_in.html 37. Primer 38. Funkcije Definicija funkcija unutar taga: function f(arg1, arg2) { ... return vrednost; } Poziv funkcije iz tela HTML dokumenta (unutar taga) Js_call_fiunction*.html 39. Funkcije JavaScriptJavaScript funkcije

Tekst sledeceg pasusa je generisan pozivom funkcije koju smo mi napisali:

40. Funkcije 41. Dogaaji Dogaaji se registruju i odrauju event handler-ima U skoro svaki element se moe staviti atribut tipa dogaaja koji ima kao vrednost ime funkcije koja e se aktivirati (event handler) Primer: 42. Dogaaji Atribut Dogaa se kada ... onabort se prekine uitavanje slike onblur element izgubi fokus onchange korisnik pormeni sadraj polja onclick se klikne miem na objekat ondblclick se dva puta klikne po objektu onerror se dogodi greka prilikom uitavanja dokumenta ili slike onfocus element dobije fokus onkeydown se pritisne taster onkeypress se pritisne, pa otpusti taster, ili se dri pritisnut onkeyup se otpusti taster onload se stranica ili slika uita onmousedown se pritisne dugme mia onmousemove se mi pomera onmouseout mi izae izvan zone elementa onmouseover mi pree preko elementa onmouseup se otpusti dugme mia onreset se klikne na reset dugme onresize se prozoru ili frejmu promeni veliina onselect je tekst selektovan onsubmit se klikne na dugme subit u formi onunload korisnik napusti stranicu 43. Dogaaji JavaScriptJavaScript dogadjaji

Dogadjaji koje svojom akcijom izazove korisnik ili web browser mogu biti obradjeni JavaScript kodom. Prilikom ucitavanja ove stranice automatski ce biti pozvana jedna JavaScript funkcija. Pored toga, moete da predjete misem preko ovog linka.

Js_dogadjaji.html Js_head_alert.html Js_call_function.html 44. Dogaaji 45. Pozivanje JavaScript-a Kao reakciju na neki dogaaj. Unutar 46. Reakcija na neki dogaaj JavaScriptJavaScript dogadjaji

Dogadjaji koje svojom akcijom izazove korisnik ili web browser mogu biti obradjeni JavaScript kodom. Prilikom ucitavanja ove stranice automatski ce biti pozvana jedna JavaScript funkcija.

47. Reakcija na neki dogaaj 48. Preko JavaScript funkcije

Tekst sledeceg pasusa je generisan pozivom funkcije koju smo mi napisali:

Js_dobar_dan.html 49. Preko 50. Ugraene funkcije Sistemske funkcije: isNaN() vraa true ako prosleeni string nije broj, eval() interpretira prosleeni string kao JavaScript kod, parseInt() parsira string u intider, parseFloat() parsira string u float promenljivu, alert() ispis poruke u MessageBox-u escape(), unescape() kodira/dekodira URL-ove (npr. zamenjuje razmak simbolom '+' i sl.) Js_alert.html 51. Hijerarhija objekata 52. Window objekt Omoguuje manipulaciju prozorima Sadri informacije o tekuem prozoru Metode: alert(), confirm(), prompt() - poruka u prozoru (MessageBox) back(), forward() - povratak na prethodnu stranicu/odlazak na sledeu (iz istorije) moveBy(), MoveTo() - pomera prozor open() - otvara nov prozor setTimeout(kod, timeout)/clearTimeout() podeava/iskljuuje kod koji e se izvravati kada istekne timeout setInterval(kod, perioda)/clearInterval() zadaje funkciju koja e se periodino izvravati Atributi: history - istorija odlazaka na stranice, document - tekui HTML dokument, frames - niz svih frejmova u prozoru, location kompletan URL tekue stranice, statusbar - statusna linija na dnu ekrana 53. Location objekt Reprezentuje URL stranice koja je uitana u navigator: location = http://www.google.com Sadri informacije o tekuem dokumentu Metode: reload() - ponovno uitavanje tekueg prozora replace() - uitava novi URL Atributi: href pun URL do stranice: location.href=http://www.google.com protocol protokol iz URL-a host adresa servera iz URL-a port port iz URL-a pathname putanja do resursa search parametri forme 54. History objekt Omoguuje kotrolu pristupa ve vienim stranicama Sadri listu adresa poseenih stranica Metode: back() - uitava prethodnu stranicu iz liste forward() uitava sledeu stranicu iz liste go() - uitava zadatu adresu iz liste Atributi: current trenutno uitana adresa length broj stavki u history listi next zadavanje sledeeg elementa previous zadavanje prethodnog elementa 55. Document objekt Omoguuje ispis HTML-a na ekran Sadri informacije o tekuem dokumentu Metode: write() - ispisuje na ekran tekst Atributi: forms - niz svih formi u dokumentu links - niz svih linkova u dokumentu applets - niz svih apleta u dokumentu title - sadrzaj title taga 56. String objekt Reprezentuje string string konstanta tekst reprezentuje string Metode: substring() vraa deo stringa split() vraa niz stringova kao rezultat razbijanja stringa indexOf(), lastIndexOf() vraa poziciju nekog podstringa charAt() vraa karakter sa zadate pozicije Atributi: length duina stringa 57. Forme Reprezentovane form objektom. Metode: submit() - alje podatke iz forme na odredite definisano action atributom form taga. reset() - simulira pritisak na Reset dugme forme. Atributi: elements - niz elemenata forme. Svaki element ima value atribut za pristup sadraju, length - broj elemenata na formi. action - sadraj action atributa. Js_forme.html 58. Forme JavaScriptJavaScript i forme

JavaScript programima moe se pristupati elementima forme. Na taj nacin moze se obaviti provera unetih podataka pre njihovog slanja.

Unesite broj izmeu 1 i 10:

59. Forme 60. Forme JavaScriptJavaScript i forme (2)

Uneli ste sledece parametre: