Sunteți pe pagina 1din 13

Javascript este un limbaj de scripting creat pentru a oferi interactiune cu paginile WEB, incorporat de obicei direct in paginile HTML

JavaScript Java JavaScript si Java sunt limbaje diferite, Java este un limbaj de programare mai puternic i mai comple! din aceea i categorie cu ", "##$ Capabilitile JavaScript JavaScript ofer% designerilor HTML un instrument de programare cu ajutorul c%ruia aproape oricine poate insera mici bucati de cod &n paginile HTML JavaScript poate genera con'inut d(namic &n paginile WEB JavaScript poate reac'iona la evenimente JavaScript poate citi i scrie elemente HTML JavaScript poate fi folosit pentru validarea datelor &nainte de trnasmiterea acestora c%tre server JavaScript poate fi folosit pentru a detecta set%rile bro)ser*ului utili+atorilor JavaScript poate fi folosit pentru a crea coo,ie*uri -mici fi iere care stoc.ea+% informa'ii pe calculatorul utili+atorului/ Inserarea de cod JavaScript in paginile HTML 0entru inserarea de cod JavaScript in paginile HTML se utili+ea+% tag*ul 1script23

1.tml2 1bod(2 1script t(pe45te!t6javascript52 document$)rite-5Buna +iua75/8 16script2 16bod(2 16.tml2

9nserarea de cod JavaScript &ntr*o pagin% HTML se poate reali+a &n urm%toarele sec'iuni3 n seciunea head

<html> <head> <script type="text/javascript"> .... </script> </head> n seciunea body <html> <head> </head> <body> <script type="text/javascript"> .... </script> </body>
:ntr*o pagin% HTML se poateinsera un num%r nelimitat de scripturi at;t &n sec'iunea .ead c;t i &n bod( -simultan/ ntr-un fi ier e!tern 0entru a oferi posibilitate utili+%rii acelora i scripturilor &n mai multe pagini se poate recurge la gruparea acestora &ntr*un fi ier cu e!tensia $js c%tre care se poate face o referin'% astfel3
<html> <head> <script src="numeFisier.js"></script> </head> <body> </body> </html>

Instruciuni JavaScript
< instruc'iune JavaScript este o comand% dat% bro)ser*ului$ Se recomand% -de i nu este obligatoriu/ plasarea la sf;r itul fiec%rei instruc'iuni a semnului 8$ JavaScript este un limbaj case sensitive. -a=/ 9nstruc'iunile pot fi grupate &n blocuri sub forma
<script type="text/javascript"> { document.write("<h >!his is a header</h >""# document.write("<p>!his is a para$raph</p>""# document.write("<p>!his is another para$raph</p>""# % </script>

9nserarea comentariilor &n paginile HTML "omentariile sunt ad%ugate pentru a e!plica instruc'iunile utili+ate i face astfel codul li+ibil$ "omentarea unei singure linii se reli+ea+% cu >66? astfel
<script type="text/javascript"> // &nstructiunea urmatoare crea'a un para$ra( document.write("<p>!his is a para$raph</p>""# document.write("<p>!his is a para$raph</p>""# // se cree'a para$ra( </script>

"omentarea mai multor linii se reali+ea+% astfel3


<script type="text/javascript"> /) acesta este un comentariul care cuprinde mai multe linii document.write("<p>!his is a para$raph</p>""# document.write("<p>!his is a para$raph</p>""# )/ </script>

Lucrul cu variabile
@ariabilele sunt utili+ate pentru stocarea temporar% a valorilor cu care se lucrea+% la un moment dat$ Aeguli pentru denumirea variabilelor3 Ex: Bumele variabilelor sunt case sensitive Bumele unei variabile trebuie s% &nceap% cu un caracter alfabetic sau cu C -underscore/

"rearea -declararea/ variabilelor se reali+ea+% utili+;nd instruc'iunea var

var !8 var (8 var suma8 var mesaj8 !4DE8 (4FE8 suma4!#(8 mesaj4?Suma este3 ?8 document$)rite-mesaj#suma/ @aribilele pot fi declarate implicit astfel3 !4G8 mesaj4?Buna +iua?8 Aedeclarare variabilelor3 !4G8 var !8 document$)rite-!/8 &n urma redeclar%rii variabilei ! ea & i p%strea+% valoarea anterioar% -G &n ca+ul de fa'%/

Operatori JavaScript:
"peratori arit#etici "onsider;nd c% (4HE
Operator + * / % ++ -Descriere Adunare Scdere nmulire mprire Modulo re!"ul #mpririi$ %ncremen"are &ecremen"are Example x=y+2 x=y-2 x=y*2 x=y/2 x=y%2 x=++y x=--y Result x=12 x=10 x=20 x=5 x=0 x=11 x='

"peratori de atribuire$ "onsider;nd !4G i (4HE


Operator = += -= *= /= Exemplu x=y x+=y x-=y x*=y x/=y Echivalent cu x=x+y x=x-y x=x*y x=x/y Rezultat x=10 x=15 x=-5 x=50 x=0(5

%=

x%=y

x=x%y

x=5

<peratorul I#? utili+at cu variabile de tip te!t are ca efect concatenarea$ E!emplu3 var nume4?9<BES"J ?8 var prenume4?0aul?8 document$)rite-nume#prenume/8 =tunci c;nd se utili+ea+% operatorul >#? &ntre un te!t i un num%r re+ultatul este un te!t$ "peratori de co#parare "onsider;nd c% !4HE
Operator == === /= 0 1 0= 1= Descriere e)al exac" e)al ,aloare -i "ip$ di+eri" mai mare mai mic mai mare !au e)al mai mic !au e)al Exemplu x==* e!"e +al! x===10 e!"e ade,ra" x===.10. e!"e +al! x/=* e!"e ade,ra" x0* e!"e ade,ra" x1* e!"e +al! x0=10 e!"e ade,ra" x1=10 e!"e ade,ra"

"peratori logici$ "onsider;nd c% !4K i (4F


Operator 22 33 / Descriere And -i$ or !au$ no" Exemplu x 1 10 22 y 0 1$ e!"e ade,ra" x==5 33 y==5$ e!"e +al! / x==y$ e!"e ade,ra"

Structuri condiionale
If%%%else Permite executarea unor secvente de cod n funcie de ndeplinirea unei condiii

Sintaxa generala if (conditie) { Cod care se va executa atunci cand conditia este indeplinita } else { Cod care se va executa atunci cand conditia este nu indeplinita } Exemplul 1: <html> <head></head> <bod > <script language!"#avascript"> var nota$ nota!prompt%"&ntroduceti nota"'"(")$ if %nota<*) + alert %",epromovat")$ else + alert %"Promovat")$ </script> </bod > </html>

.n exemplul pre/entat se solicit0 introducerea unei valori de la tastatur0 utili/1nd instruciunea prompt' valoare care este stocat0 n variabila nota2 3aca valoarea acesteia este mai mic0 dec1t * atunci se va afi4a cu instruciunea alert mesa#ul 5,epromovat6' n ca/ contrar se afi4ea/0 5Promovat62 Exemplul 7: <html> <head></head> <bod > <script language!"#avascript"> var nota$ nota!prompt%"&ntroduceti nota"'"(")$ if %nota<*) + alert %",epromovat")$ else + if %nota<8) + alert %"9ine")$ else + alert %":oarte bine")$ </script> </bod > </html>

switch switch(n) { case 1 bloc 1 de instruciuni brea!" case # bloc 2 de instruciuni brea!" de$a%lt bloc de executat n situaia n care n este diferit de cazul 1 sau 2 &
Structuri repetitive
Sunt structuri care permit repetarea
<script lan$ua$e="javascript" type="text/javascript"> var n =*umber(+"# var i = *umber(+"# var suma = *umber(+"# n= prompt(",entru cate numere doriti sa calculati suma"" # (or (i=+# i<=n#i--" { suma=suma-i# % alert (".uma este " -suma"# var s = new .trin$# </script>

Sintaxa

&hile
/epet0 execu1ia unui bloc de instruc1iuni at2ta timp c3t o condi1ie este 2ndeplinit0 .intaxa while (condi1ie" { 4loc de instruc1iuni %

Exemplu <html> <bod > <script language!"#avascript"> var n!,umber%()$ var i!,umber%()$ var suma!,umber%()$ n!prompt%"Pentru cate numere calculati suma")$ ;hile %i<!n) + suma!suma<i$ i<<$ alert%"Suma este: " <suma)$ </script> </bod > </html>

do%%%&hile
execut0 o dat un bloc de instruciuni' dup0 care repet0 execuia acelui bloc at1ta timp c1t condiia de la finalul blocului este ndeplinit0 <html> <bod > <script language!"#avascript"> var n!,umber%()$ var i!,umber%()$ var suma!,umber%()$ n!prompt%"Pentru cate numere calculati suma")$ do { suma=suma+i; i++; } while (i<=n); alert%"Suma este: " <suma)$ </script>

</bod > </html>

'uncii JavaScript
= funcie conine cod care va fi executat la apariia unui eveniment sau c1nd va fi apelat de c0tre alt0 funcie2 :unciile pot fi declarate in orice /ona a paginii %de asemenea pot fi declarate intr>un fisier extern cu extensia 2#s)2 Ele pot fi definite atat in sectiunea head cat si in bod ' dar pentru a avea certitudinea nc0rc0rii funciei n memorie nainte de apelarea ei se recomand0 declararea acestora n seciunea head2 Sintaxa generala utili/at0 la declararea unei funcii:
(unction nume_functie(var1,var2,...,varX" { Bloc instruciuni %

unde var1'var7'222'var? sunt parametric ai funciei = funcie f0r0 parametri se declar0 astfel
(unction nume_functie (" { Bloc instruciuni %

Exemplul 1 <html> <head> <script language!"#avascript"> function suma%n) + var i!,umber%()$ var suma!,umber%()$ do + suma!suma<i$ i<<$ //i!i<1 ;hile %i<!n)$ alert%"Suma este: " <suma)$

</script> </head> <bod > <script language!"#avascript"> var n$ n!prompt%"Pentru cate numere calculati suma@")$ re/ultat!suma%n)$ </script> </bod > </html> Aa incarcarea paginii se declansea/a evenimentul onload care apelea/a functia suma cu parametrul Number(4). Exemplul 7 <html> <head> <script language!"#avascript"> function mesa#%) + alert%59una /iua6)$ </script> </head> <bod onload!"mesa#%)"> </bod > </html> :unctii care returnea/a o valoare .n acest ca/ trebuie utili/at0 instruciunea return care permite ob4inerea unei valori n urma execuiei funciei2 Exemplu: <html> <head> <script language!"#avascript"> function sum%n) + var i!,umber%()$ var suma!,umber%()$ ;hile %i<!n)

+ suma!suma<i$ i<<$ //i!i<1 return suma; </script> </head> <bod > <script language!"#avascript"> var n$ var re/ultat$ n!prompt%"Pentru cate numere calculati suma@")$ re/ultat!sum%n)$ alert%"Suma este: "<re/ultat)$ </script> </bod > </html> BBB 3urata de viaa a variabilelor n CavaScript Dariabilele declarate n cadrul unei funcii CavaScript sunt variabile locale' adic0 ele pot fi accesate doar n cadrul funciei respective2 3upa executarea functiei ele sunt distruse2 3rept urmare pot fi declarate variabile cu acela4i nume n funcii diferite deoarece fiecare dintre ele este recunoscut0 numai de funcia n cadrul c0reia a fost declarat02 Dariabilele declarate n afara funciilor pot fi accesate de c0tre toate funciile2 Existena acestora ncepe n momentul declar0rii lor 4i se termin0 atunci c1nd pagina este nchis02

(veni#ente JavaScript
Evenimentele sunt aciuni care pot fi detectate de CavaScript2 :iecare element al unei pagini ;eb are ata4ate evenimente care pot declan4a funcii CavaScript2 Exemple de evenimente:

En clicF sau dubluclicF de mouse .nc0rcarea unei pagini sau a unei imagini 3eplasarea mouse>ului deasupra unei /one reactive dintr>o pagin0 Selectarea unei casete de validare dintr>un formular GHIA

Hransmiterea unui formular GHIA Jp0sarea unei taste