Documente Academic
Documente Profesional
Documente Cultură
FOARTE IMPORTANT!!!! JavaScript NU este JAVA!!! La sfritul anilor 90, cei care au inventat JavaScript-ul au vrut s-i atrag popularitate, i astfel i-au dat un nume apropiat de cel al limbajul de programare JAVA. Totui, n momentul n care au luat aceast decizie, au indus n eroare muli oameni, care consider c JavaScriptul are legtura cu Java. Pentru a clarifica lucrurile: Java nu are nicio legtur cu JavaScript-ul! Java este un descendent al limbajelor de programare C i C++. Programatorii pot s creeze aplicaii Java care s ruleze pe diferite platforme cum ar fi: Windows, Mac, Linux. Java mai poate fi folosit pentru a crea applets (mici programe care pot fi downloadate si rulate n browserele Web).
smaranda.belciug@inf.ucv.ro
Ce poate face JavaScript pentru pagina ta? O persoan nu trebuie s se sperie, nu trebuie s fie un as n programare pentru a scrie script-uri n JavaScript. Datorit invenie demne de Premiul Nobel copy i paste, o persoana nu trebuie s fie un guru pentru a adaug script-uri paginii sale Web. poate transforma o pagin plictisitoare ntr-una dinamic un script scurt poate verifica dac datele au fost nscrise corect ntr-un form, nainte ca acestea s fie procesate adaug funcionalitate paginii se poate interaciona cu utilizatorii detecteaz dac utilizatorul are un browser care permite vizualizarea de coninut multi-media redirecteaz automat utilizatorii ctre o alt pagin Web
Lucrul cu ferestrele de browser JavaScript poate s-i transmit browser-ului s deschid sau s nchid ferestre. Probabil acest lucru enervant l-ai observat pn acum: ferestre pop-up care apar cnd ncerci s prseti un site. Dar aceast tehnologie poate fi folosit pentru a face i bine, nu numai ru. De exemplu, poi s ai un preview la un set de imagini n format mare, folosind nite versiuni thumbnail. Fcnd click pe o imagine thumbnail poate aduce la: deschiderea unei ferestre care s conin versiunea mrit a imaginii deschiderea unei ferestre cu un link text care deschide o fereastra cu ilustrarea acelui text, cum se vede n figura de mai jos.
smaranda.belciug@inf.ucv.ro Acest script face una din cele dou operaii enumerate mai jos, dac oricare din cele dou cmpuri din formular nu sunt completate, n momentul n care utilizatorul face click pe butonul Sumbit: i spune browser-ului s afieze un avertisment pentru a-i transmite utilizatorului c a uitat s completeze un cmp Returneaz o valoare false browser-ului, fapt ce previne ca browser-ul s nu trimit formularul la procesare.
Inainte de a ncepe nvarea JavaScript-ului este necesar prezentarea unui exemplu de pagin ce folosete mult JavaScript:
Includerea de script-uri n pagina Web Deoarece un script JavaScript face parte dintr-o alt specie fa de markup-ul HTML, trebuie s-l includem ntr-un tag HTML, <script> i </script>. Un script poate fi introdus n: Seciunea <head> </head> (header script) Seciunea <body> </body> (body script) Script-urile header conin cod pe care l doreti procesat nainte ca pagin s se ncarce, sau pentru ca acel script sa poata s fie apelat de alt script din pagina Web. Script-urile body sunt executate cnd tag-ul <body> este procesat. Urmtorul script deschide o fereastra pop-up n momentul n care se ncarc pagina.
<!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN
smaranda.belciug@inf.ucv.ro
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd> <html xmlns=http://www.w3.org/1999/xhtml> <head> <title>My JavaScript page</title> <script language=Javascript type=text/javascript> alert(Welcome to my JavaScript page!) </script> </head> <body bgcolor=#FFFFFF> <h2>This script pops up a message box for the user.</h2> </body>
Tag-ul script precedent are dou atribute: Language = Javascript i spune browser-ului ce fel de limbaj de script-uri folosete documentul Type = text/javascript spune browser-ului c script-ul conine doar text n JavaScript Metoda alert() afieaz un mesaj care se deschide n fereastra browser-ului i conine un anumit mesaj. Folosirea aceluiai script n mai multe pagini Dac ai o singur pagin Web care folosete un script JavaScript este bine s ai toate codurile scrise ntr-un singur tag <script>. Dar dac ai mai multe pagini care folosesc acelai script? Poi s copiezi script-ul n fiecare pagin, dar este destul de complicat. Trebuie s adaugi script-ul n fiecare pagin i s te asiguri c este corect i c merge De fiecare dat cnd script-ul se modific, eti forat s-l modifici n fiecare pagin n parte. Dac ai doar dou pagini, nu este foarte dificil. Dar dac ai mai mult de trei pagini, poate cauza migrene de mentenan. Solutia? Folosirea unui fiier extern JavaScript, numit fiier .js. Un fiier .js este un fiier obinuit n care se stocheaz script-uri JavaScript. (asemntor cu .css) Pentru a folosi acelai script n mai multe pagini, trebuie: 1. S introduci script-ul ntr-un fiier extern JavaScript 2. Introduci fiierul n orice pagin HTML de cteori ai nevoie de el.
<!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd> <html xmlns=http://www.w3.org/1999/xhtml> <head> <title>My JavaScript page</title> <script src=external.js language=JavaScript type=text/javascript> </script> </head> <!-- restul paginii ncepe aici-->
smaranda.belciug@inf.ucv.ro
contactOff = new Image pressOff = new Image homeOver = new Image productsOver = new Image contactOver = new Image pressOver = new Image homeOff.src = images/home_off.jpg productsOff.src = images/products_off.jpg contactOff.src = images/contact_off.jpg pressOff.src = images/press_off.jpg homeOver.src = images/home_over.jpg productsOver.src = images/products_over.jpg contactOver.src = images/contact_over.jpg pressOver.src = images/press_over.jpg function imgOver(thisImg) { document[thisImg].src = images/ + thisImg + _over.jpg } function imgOut(thisImg) { document[thisImg].src = images/ + thisImg + _off.jpg }
Limbajul JavaScript Regulile sintaxei JavaScript este case-sensitive. JavaScript ignora spaiile i tab-urile. Comentariile se scriu cu // sau /*.*/. Variabilele nu pot ncepe cu o cifr. Ele pot conine cifre, litere i underline. Ele nu pot avea acelai nume cu un cuvnt cheie. Tipuri de date Tip Number String Object Descriere Orice valoare numerica Text inclus ntre ghilimele Un obiect JavaScript care poate fi definit de limbaj sau creat de tine Valoare returnat de o funcie O valoare logic: true sau false Nu are valoare Exemplu
42 my name is window
smaranda.belciug@inf.ucv.ro
Asignare
x=y x += y x -= y x *= y x /= y
Descriere
x ia valoarea lui y x=x+y x=x-y x=x*y x=x/y
Exemplu
x + y (numeric) x-y x*y x/y -x
if ( x = Boxen ) { y=1 alert( You are a smarty! The correct answer is Boxen. Well done!) }
if ( x = Boxen ) { y=1 alert( You are a smarty! The correct answer is Boxen. Well done!) } else { y=0 alert( You are totally wrong! The correct answer is Boxen. Bad!) }
if (confirm(Are you sure you want to do that?)) { alert(You said yes) } else { alert(You said no)
smaranda.belciug@inf.ucv.ro
}
Bucle (cicluri) Cnd trebuie s repei o aciune ntr-un script JavaScript, foloseti o bucl. De exemplu, un script care folosete o bucl poate: S verifice fiecare caracter dintr-un cod S verifice fiecare element al unei liste n cutarea unei anumite valori For
<!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd> <html xmlns=http://www.w3.org/1999/xhtml> <head> <title>A For Loop</title> </head> <body> <script type=text/javascript language=javascript> document.write(<h3>Multiplication table for 7</h3>) for (loopCount = 0; loopCount <= 10; loopCount++) { document.write(7 X ,loopCount, = , 7 * loopCount,<br />); } </script> </body> </html>
While
<!DOCTYPE html PUBLIC -//W3C//DTD XHTML 1.0 Transitional//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd>
smaranda.belciug@inf.ucv.ro
<html xmlns=http://www.w3.org/1999/xhtml> <head> <title>A While Loop</title> </head> <body> <script type=text/javascript language=javascript> con = confirm(Do you want to continue?) while(con == false) { document.write(Continuing to wait<br />); con = confirm(Do you want to continue?) } </script> </body> </html>