Java Script Istoria Java Script a fost dezvoltat
- Slides: 98
Java. Script
Istoria Java. Script a fost dezvoltat prima data de catre firma Netscape, cu numele de Live Script, un limbaj de script care extindea capacitatile HTML pentru prelucrarea informatiilor din formulare si care adauga dinamism in paginile web. Dupa lansarea limbajului Java, Netscape a inceput sa lucreze cu firma Sun, cu scopul de a crea un limbaj de script cu o sintaxa si semantica asemanatoare cu a limbajului Java, si din motive de marketing numele noului limbaj de script a fost schimbat in "Java. Script". Java Script a aparut din nevoia ca logica si inteligenta sa fie si pe partea de client , nu doar pe partea de server. Pe langa Jscript, Microsoft a introdus si un concurent pentru Java. Script, numit VBScript, realizat pentru a usura patrunderea pe web a programatorilor VB. VBScript este un subset al limbajului Visual Basic. Cu toate acestea Java. Script a devenit cunoscut ca limbajul de scripting standard pentru web.
Noţiuni de bază • Java. Script poate fi introdus in HTML. • Java. Script este dependent de mediu – Java. Script este un limbaj de scriptare; software-ul care ruleaza de fapt programul este browser-ul web (Firefox, Opera, Netscape Navigator, Internet Explorer, Safari, etc. ) Este important de luat in considerare aceasta dependenta de browser utilizînd aplicatii Java. Script. • Java. Script este un limbaj in totalitate interpretat – codul scriptului va fi interpretat de browser inainte de a fi executat. Java. Script nu necesita compilari sau preprocesari, ci ramane parte integranta a documentului HTML.
Noţiuni de bază • Java. Script este bazat pe obiecte – Java. Script nu este un limbaj de programare orientat obiect, ca Java, ci mai corect, este "bazat pe obiecte"; modelul de obiect Java. Script este bazat pe instanţă şi nu pe moştenire. • Java. Script este condus de evenimente – mare parte a codului Java. Script raspunde la evenimente generate de utilizator sau de sistem. Obiectele HTML, cum ar fi butoanele, sunt imbunătăţite pentru a accepta handlere de evenimente. • Java. Script nu este Java – Cele doua limbaje au fost create de companii diferite, motivul denumirii asemanatoare este legat doar de marketing.
Noţiuni de bază • Java. Script este multifunctional – limbajul poate fi folosit intr-o multitudine de contexte pentru a rezolva diferite probleme: grafice, matematice, si altele. • Java. Script evolueaza. • Java. Script acopera contexte diverse – programarea cu acest limbaj este indreptata mai ales catre partea de client, dar este posibil de a folosi Java. Script si pentru partea de Server. Java. Script este limbajul nativ pentru unele instrumente de dezvoltare web, ca Borland Intra. Builder sau Macromedia Dreamweaver.
Adaugarea Java. Script intr-un document HTML (1) <html> <body> <h 1>My First Web Page</h 1> <p id="demo"> Textul documentului in care este adaugat Java. Script </p> <script type="text/javascript">. . . codul Java. Script . . . </script> </body> </html> Textul documentului in care este adaugat Java. Script Reprezentarea rezultatului codului
Adaugarea Java. Script intr-un document HTML (1) <html> <body> <h 1>Textul documentului in care este adaugat Java. Script</h 1> <script type="text/javascript"> document. write("<h 1>Titlul Java. Script</h 1>"); document. write("<p>Un paragraf in Java. Script. </p>"); </script> </body> </html> Textul documentului in care este adaugat Java. Script Titlul Java. Script Un paragraf in Java. Script
Adaugarea Java. Script intr-un document HTML (1) <html> <body> <h 1>Textul documentului in care este adaugat Java. Script</h 1> <script> document. write("<h 1>Titlul Java. Script</h 1>"); document. write("<p>Un paragraf in Java. Script. </p>"); </script> </body> </html> Textul documentului in care este adaugat Java. Script Titlul Java. Script Un paragraf in Java. Script
Adaugarea Java. Script intr-un document HTML (1) <html> <body> <h 1>Textul documentului in care este adaugat Java. Script</h 1> <script> document. write("<h 1>This is a heading</h 1>"); document. write("<p>This is a paragraph. </p>"); </script> </body> </html> Textul documentului in care este adaugat Java. Script Titlul Java. Script Un paragraf in Java. Script este bazat pe obiecte
Adaugarea Java. Script intr-un document HTML (1) <div id="demo">Elementul schimbat de Java. Script</div> <script> document. get. Element. By. Id("demo"). inner. HTML = "<h 1>Salut la toti!</h 1>"; </script> Salut la toti!
Adaugarea Java. Script intr-un document HTML (1) <p id="demo">Elementul schimbat de Java. Script</p> <script> document. get. Element. By. Id("demo"). inner. HTML = "<h 1>Salut la toti!<h 1>"; </script> Salut la toti! Java. Script este bazat pe obiecte
Adaugarea Java. Script intr-un document HTML (1) <html> <body> < h 1>Textul documentului in care este adaugat Java. Script</h 1 > <p id="demo">Elementul schimbat de Java. Script</p> <!-- <script type="text/javascript"> document. get. Element. By. Id("demo"). inner. HTML=Date(); </script> //--> </body> </html> Textul documentului in care este adaugat Java. Script Fri Oct 14 01: 03: 35 2011
Adaugarea Java. Script intr-un document HTML (1) <html> <body> < h 1>Textul documentului in care este adaugat Java. Script</h 1 > Textul documentului in care este adaugat Java. Script Fri Oct 14 01: 03: 35 2011 <p id="demo">Elementul schimbat de Java. Script</p> <script> document. get. Element. By. Id("demo"). inner. HTML=Date(); </script> </body> </html> Java. Script este dependent de mediu
Adaugarea Java. Script intr-un document HTML (2) <html> <head> <script type="text/javascript"> function display. Date() { document. get. Element. By. Id("demo"). inner. HTML=Date(); } </script> </head> <body> <h 1>Java. Script in head</h 1> <p id="demo">Textul documentului in care este adaugat Java. Script</p> <button type="button" onclick="display. Date()">Data si ora</button> </body> </html>
Adaugarea Java. Script intr-un document HTML (2) <html> <head> <script> function display. Date() { document. get. Element. By. Id("demo"). inner. HTML=Date(); } </script> </head> <body> <h 1>Java. Script in head</h 1> <p id="demo">Textul documentului in care este adaugat Java. Script</p> <button type="button" onclick="display. Date()">Data si ora</button> </body> </html>
Adaugarea Java. Script intr-un document HTML (2) <html> <head> <script> function display. Date() { document. get. Element. By. Id("demo"). inner. HTML=Date(); } </script> </head> <body> <h 1>Java. Script in head</h 1> <p id="demo">Textul documentului in care este adaugat Java. Script</p> <button type="button" onclick="display. Date()">Data si ora</button> </body> </html>
Adaugarea Java. Script intr-un document HTML (2) <html> <head> <script> function display. Date() { document. get. Element. By. Id("demo"). inner. HTML=Date(); } </script> </head> <body> Java. Script este <h 1>Java. Script in head</h 1> condus de evenimente <p id="demo">Textul documentului in care este adaugat Java. Script</p> <button type="button" onclick="display. Date()">Data si ora</button> </body> </html>
Rezultat
Adaugarea Java. Script intr-un document HTML (1) <button type="button" onclick="alert('Welcome!')" > Click Me! </button>
Adaugarea Java. Script intr-un document HTML (3) <html> <head> </head> <body> <script type="text/javascript" src=“myscript. js"> </script> <p> Scriptul se afla in fisierul "myscript. js". </p> </body> </html>
Adaugarea Java. Script intr-un document HTML (3) <html> <head> <script type="text/javascript" src="myscript. js"></script> </head> <body> <p> Scriptul se afla in fisierul "myscript. js". </p> </body> </html>
Adaugarea Java. Script intr-un document HTML (3) <html> <head> myscript. js <title> Pagina lui Georgica function display. Date() </title> { <script type="text/javascript" document. get. Element. By. Id("demo" src="myscript. js"></script> ). inner. HTML=Date(); </head> } <body> <h 3>Inserarea Java. Script in documentul HTML</h 3> <p id="demo"></p> <button type="button" onclick="display. Date()">Data si ora</button> </body> </html>
Adaugarea Java. Script intr-un document HTML (3) <html> <head> myscript. js <title> Pagina lui Georgica function display. Date() </title> { <script type="text/javascript" document. get. Element. By. Id("demo" src="myscript. js"></script> ). inner. HTML=Date(); </head> } <body> <h 3>Inserarea Java. Script in documentul HTML</h 3> <p id="demo"></p> <button type="button" onclick="display. Date()">Data si ora</button> </body> </html>
Rezultat
Adaugarea Java. Script intr-un document HTML (3) <html> <head> <title> Pagina lui Georgica </title> </head> <body> <h 3>Inserarea Java. Script in documentul HTML</h 3> <p align=right> <SCRIPT SRC="copyright. js"> </SCRIPT> </body> </html> copyright. js var lastmoddate = document. last. Modified; if(lastmoddate == 0) {document. writeln("Lastmodified: Unknown<BR>© 1999 Copyright Shelley Biotech")} else {document. writeln("Last. Modified: " + lastmoddate + "<BR>© 1999 Copyright Shelley Biotech")}
Rezultat
Sintaxa Java. Script 1. Case-sensitive - se face diferenta intre literele mari si mici, astfel cuvinte precum "exemple, Exemple" vor fi tratate diferit. 2. Punct si virgula (; ) - Toate declaratiile trebuie sa se termine cu un caracter "punct si virgula" (; ). 3. Spatiile libere - Java. Script ignora spatiile libere. Recunoaste doar spatiile care apar în string-uri (sirurile de caractere). Exemplu: "var 1 = 2 ; " este la fel cu "var 1=2; ". 4. Ghilimelele - Ghilimelele simple ('') si duble ("") sunt folosite pentru a delimita sirurile de caractere (string). 5. Carcactere speciale: n - indica o linie noua t - indica o apasare a tastei TAB \ - indica un caracter backslash " - indica ghilimele duble
Sintaxa Java. Script • 6. Comentarii: Pentru a adauga un comentariu, pe o singura linie, in interiorul codului, incepem scrierea acestuia cu succesiunea // (Exemplu: // Comentariu). Daca dorim sa scriem comentarii pe mai multe randuri, se foloseste /* la inceputul comentariului si */ la sfarsitul acestuia (Exemplu: /*. . . comentariu pe mai multe randuri. . . */) • 7. Numele variabileler si functiilor - numele dat variabilelor si functiilor trebuie sa respecte urmatoarele reguli: – - primul caracter trebuie sa fie o litera, un caracter de subliniere (_) sau semnul $ - primul caracter nu poate fi un numar - numele nu trebuie sa contina spatii libere - nu se folosesc cuvinte rezervate, care fac parte din limbajul Java. Script (cum sunt "array", "status", "alert").
Sintaxa Java. Script operatori • - Operatori aritmetici - Operatori de atribuire - Operatori de comparare - Operatori logici (numiti si booleeni) - Operatori pentru siruri - Operator conditional ? - Operatori pentru functii - Operatori pentru structuri de date
Sintaxa Java. Script Operatori aritmetici • • adunare (+), scadere (-), inmultire (*), impartirere (/) mod (%) - (8%3 da rezultatul 2 ) Incrementare (++) Decrementare (--)
Sintaxa Java. Script Operatori de atribuire
Sintaxa Java. Script Operatori de comparare
Sintaxa Java. Script Operatori logici (booleeni) • && - si (and) - Compara doua expresii si returneaza TRUE daca amandoua sunt adevarate, in caz contrar returneaza FALSE. Eexemplu: – x = 5 y = 8 x<7 && y>3 (returneaza TRUE) • || - sau (or) - Compara doua expresii si returneaza TRUE daca cel putin una din ele este adevarata, in caz contrar returneaza FALSE. Eexemplu: – x = 5 y = 8 x>7 || y<3 (returneaza FALSE) • ! - not - este operator unar, foloseste o singura expresie si returneaza TRUE daca expresia este falsa, daca expresia este adevarata returneaza FALSE. Eexemplu: – x = 5 y = 8 !(x==y) (returneaza TRUE deoarece 'x' nu este egal cu'y')
Sintaxa Java. Script Operator pentru string (sir) concatenare a sirurilor + t 1 = "Astazi este o zi" t 2 = "frumoasa" t 3 = t 1+t 2 (Variabila 't 3' va contine sirul "Astazi este o zifrumoasa") Adaugarea spatiului intre variabilele string Exemplu: t 1 = "Astazi este o zi" t 2 = "frumoasa" t 3 = t 1+" "+t 2 (Variabila 't 3' va contine sirul "Astazi este o zi frumoasa")
Sintaxa Java. Script Operatori pentru structuri de date (obiecte) Un operator care ar trebui cunoscut bine este punctul ". " numit operator pentru membrul unei structuri. Acesta ne permite sa ne referim la un membru ( variabila, functie sau obiect ) care apartine obiectului specificat. Sintaxa este urmatoarea : nume. Obiect. nume_proprietate nume. Obiect. nume_metoda() nume. Obiect. alt_obiect
Sintaxa Java. Script Operator indice al tabloului Acesta este simbolizat printr-o pereche de paranteze drepte [ ] , si permite sa ne referim la orice membru al unui tablou. Sintaxa de folosire a operatorului pentru tablou este : nume_tablou[cheie]
Sintaxa Java. Script Operatorul conditional "? " variabila = (conditie)? val 1: val 2 - se evalueaza conditia, daca este adevarata atunci variabila ia valoarea 'val 1', altfel ia valoarea 'val 2'. Exemplu: vizitator = "barbat" mesaj = (vizitator=="barbat")? "Stimate domn": "Stimata doamna" document. write(mesaj)
Sintaxa Java. Script Instructiuni conditionale • if - executa comenzile dorite cand o conditie este adevarata. • if. . . else - executa anumite comenzi cand o conditie este adevarata si alte comenzi cand aceasta este falsa. • switch - selecteaza care comanda va fi executata.
Sintaxa Java. Script Instructiuni conditionale - if <script > // daca ora > 11, // va scrie în fereastra Buna ziua! var d = new Date() var time = d. get. Hours() if (time>11) { document. write("<b>Buna ziua!</b>") } </script>
Sintaxa Java. Script Instructiuni conditionale if …else <script> // daca ora > 11, // va scrie în fereastra Buna ziua! // Alfel afiseaza "Este ora. . . " var d = new Date() var time = d. get. Hours() if (time>11) { document. write("<b>Buna ziua!</b>") } else { document. write("<b>Este ora " +time+ "</b>") } </script>
Sintaxa Java. Script Instructiuni conditionale - switch var d = new Date() var ziua = d. get. Day() switch (ziua) { case 5: document. write("Astazi e vineri"); break case 6: document. write("Astazi e sambata"); break case 0: document. write("Astazi e duminica"); break default: document. write("Mai e pana sambata"); }
Sintaxa Java. Script Instructiuni ciclice (repetitive) for - executa codul de un numar specificat de ori; while - repeta codul atata timp cat o anumita conditie este adevarata; do. . . while - intai executa o data codul apoi il repeta atata timp cat o anumita conditie este adevarata;
Sintaxa Java. Script Instructiunea for <script type="text/javascript"> <!-for (x=1; x<5; x++) { document. write ("<br /> x este "+x); } //--> </script>
Sintaxa Java. Script Instructiunea for <script type="text/javascript"> <!-for (x=1; x<5; x++) { document. write ("<br /> x este "+x); } //--> </script> x este 1 x este 2 x este 3 x este 4
Sintaxa Java. Script Instructiunea while <script type="text/javascript"> <!-var x = 1; while (x<5) { document. write ("<br /> x este "+x); x++; } //--> </script>
Sintaxa Java. Script Instructiunea while <script type="text/javascript"> <!-var x = 1; while (x<5) { document. write ("<br /> x este "+x); x++; } //--> </script> x este 1 x este 2 x este 3 x este 4
Sintaxa Java. Script Instructiunea do. . . while <script type="text/javascript"> <!-var x = 8; do { document. write("<br /> x este "+x); x++; } while (x<5) //--> </script>
Sintaxa Java. Script Instructiunea do. . . while <script type="text/javascript"> <!-var x = 8; do { document. write("<br /> x este "+x); x++; } while (x<5) //--> </script> x este 8
Sintaxa Java. Script Fereastra Alert <script type="text/javascript"> window. alert("Bine ai venit"); </script>
Sintaxa Java. Script Fereastra Prompt <script type="text/javascript"> window. prompt("Scrieti numele", "Nume"); </script>
Sintaxa Java. Script Fereastra Prompt <script type="text/javascript"> var nume = window. prompt("Scrieti numele", "Nume"); alert("Salut "+nume+"n Bine ai venit. "); </script>
Sintaxa Java. Script Fereastra Confirm <script type="text/javascript"> intrebare = window. confirm("Rezultatul lui 0+0 este 0? "); if (intrebare) alert("Corect"); else alert("Incorect"); </script>
Sintaxa Java. Script Functii • Predefinite • Create de programator – - care returneaza o valoare – - care nu returneaza o valoare
Sintaxa Java. Script Crearea (definirea) functiilor function nume_functie(argument 1, argument 2, . . . ) { codul care va fi executat } Instructiunea return function suma(x, y) { z = x+y; return z }
Exemplu de funcţie cu return <html> <head> <script type="text/javascript"> <!-- function exemplu 1() { return document. write("Bine ati venit!") } //--> </script> </head> <body> <script> exemplu 1() </script> </body> </html>
Exemplu de funcţie cu argumente <html> <head> <script type="text/javascript"> <!-- function exemplu 3(x, y) { var z = 0; z = x+y; return alert("Suma lui "+x+" si "+y+" este: "+z) } //--> </script> </head> <body> <form> <input type="button" onclick="exemplu 3(7, 8)" value="Suma" /> </form> </body> </html>
Evenimente <html> <head> <script type="text/javascript"> function display. Date() { document. get. Element. By. Id("demo" ). inner. HTML=Date(); } </script> </head> <body> <h 1>Exemplu de eveniment</h 1> <p id="demo">Oarecare text. </p> <button type="button" onclick="display. Date()">Data si ora</button> </body> </html>
Evenimente • Trecerea cursorului mouse peste o area pe pagina web • Încărcarea paginii web ori a imaginii • Click mouse, double click • Selectarea unui cîmp de întroducere a datelor într-un formular HTML • Submit unui HTML formular • Apăsarea unei taste • etc.
Evenimente <html> <head> <title>Exemplu de eveniment</title> <script> function Hello. World() { alert ('Salut la toti!'); } </script> </head> <body on. Load="Hello. World()"> Textul paginii </body> </html>
Evenimente <html> <head> <title>Exemplu de eveniment</title> <script> function Hello. World() { alert ('Salut la toti!'); } </script> </head> <body> <p> <span on. Mouse. Over="Hello. World()">Salut</span> </p> </body> </html>
Evenimente <html> <head> <title>Exemplu de eveniment</title> <script> function Hi() { alert ('Nu ai apasat!'); } </script> </head> <body> <a href= "nou. html" on. Mouse. Out="Hi()">Hello</a> </body> </html>
Evenimente Onresize Onload on. Mouse. Out Onunload on. Change on. Blur on. Select sizes 2. html exemple_evenimente. html examples_img_m. html exemple_evenimente. html ex_form_Java. Script. html JS 9. html
Obiecte în Java. Script • Java. Script nu este un program orientat pe obiecte (OO), cum sunt C++ sau Java, dar este bazat pe obiecte. • Toate elementele dintr-o pagina sunt vazute de Java. Script ca fiind obiecte. • Obiectele au anumite proprietati, de exemplu: formularele au buton, ferestrele au titluri, textul are culoare, etc. • Metodele reprezinta functiile care pot fi aplicate la un obiect. Ferestrele se deschid cu metoda "open()", butoanele au metoda "click()“, . . .
Sintaxa Java. Script Operatori pentru structuri de date (obiecte) Un operator care ar trebui cunoscut bine este punctul ". " numit operator pentru membrul unei structuri. Acesta ne permite sa ne referim la un membru ( variabila, functie sau obiect ) care apartine obiectului specificat. Sintaxa este urmatoarea : nume. Obiect. nume_proprietate nume. Obiect. nume_metoda() nume. Obiect. alt_obiect
Adaugarea Java. Script intr-un document HTML (1) <p id="demo">Elementul schimbat de Java. Script</p> <script> document. get. Element. By. Id("demo"). inner. HTML = "<h 1>Salut la toti!<h 1>"; </script> Salut la toti! Java. Script este bazat pe obiecte
Manipularea obiectelor • • • examples_img_2. html openwin. html JS_styles. html events_styles_mod. html JS 9_mod 2. html
Obiecte în Java. Script Sintaxa pentru folosirea obiectelor: obiect. prorietate obiect. metoda() Categorii de obiecte predefinite în Java. Script: - Obiecte pe partea de client - Obiecte pe partea de server - Obiecte esenţiale
Obiecte în Java. Script Obiecte esenţiale: 1 - String 2 - Math 3 - Date 4 - Array 5 - Global
Obiectul string Proprietatea: length ( exemplu: v=text. length; ) Metodele: bold() - Returneaza un sir cu litere ingrosate char. At() - Returneaza un caracter de la pozitia care este specificata concat() - Returneaza doua siruri concatenate replace() - Inlocuieste intr-un sir unele caractere specificate cu altele noi specificate. search() - Returneaza un numar intreg daca sirul contine caracterele specificate, altfel returneaza -1 slice() - Returneaza un sir incepand de la pozitia index specificata etc. . .
Obiectul string <html> <body> <script type="text/javascript"> var str="Hello world!"; document. write(str. match("world") + "<br />"); document. write(str. match("World") + "<br />"); document. write(str. match("world!")); </script> </body> </html>
Obiectul string <script type="text/javascript"> var str="Mar. Plo. net - Cursuri, Jocuri si Anime" document. write(str+"<br />") document. writeln("Acest sir are "+ str. length + " caractere") var pos=str. index. Of("Jocuri") if (pos>=0) { document. write("Jocuri incepe de la pozitia: ") document. write(pos + "<br />") } else { document. write("Cuvântul nu a fost gasit!") } </script>
Obiectul Array Crearea obiectului Array var nume_colegi = new Array(4); sau var nume_colegi = Array('Cristi', 'Ion', 'Simona', 'Adi');
Obiectul Array Proprietatea: Length ( exemplu: v=nume_colegi. length; ) Metodele: concat() - returneaza un tablou rezultat din concatenarea a doua tablouri; join() - returneaza un tablou format din toate elementele unui tablou concatenat; reverse() - Returneaza inversul unui tablou; slice() - Returneaza o parte specificata a unui tablou; sort() - Returneaza tabloul ordonat;
Obiectul Array <script type="text/javascript"> <!-- var nume_colegi = new Array(); nume_colegi[0] = "Cristi"; nume_colegi[1] = "Ion"; nume_colegi[2] = "Simona"; nume_colegi[3] = "Adi"; var nr_elemente = nume_colegi. length; document. write("Afiseaza numele fiecarui coleg: <br />"); for (i=0; i<nr_elemente; i++) { document. write(nume_colegi[i] + "<br />"); } //--> </script>
Obiectul Date Crearea instanţei a obiectului "Date“: var data = new Date(); Metodele obiectului Date: • get. Date() - Returneaza data (ziua) din luna (intre 1 -31) • get. Day() - Returneaza ziua dintr-un obiect Date (intre 0 -6; 0=Duminica, 1=Luni, etc. ) • get. Month() - Returneaza luna dintr-un obiect Date (intre 0 -11. 0=January, 1=February, etc. ) • get. Full. Year() - Returneaza anul dintr-un obiect Date (patru cifre) • get. Hours() - Returneaza ora dintr-un obiect Date (intre 0 -23) • get. Minutes() - Returneaza minutele dintr-un obiect Date (intre 0 -59) • get. Seconds() - Returneaza secunda dintr-un obiect Date (intre 0 -59) • get. Milliseconds() - Returneaza milisecunda dintr-un obiect Date (intre 0 -999) • etc.
Obiectul Date <script type="text/javascript"> <!-var d = new Date() document. write("Afiseaza data curenta a zilei: <br /> ") document. write(d. get. Date()) document. write(". ") document. write(d. get. Month() + 1) document. write(". ") document. write(d. get. Full. Year()) //--> </script>
Obiectul Date <html> <head> <script type="text/javascript"> function start. Time() { var today=new Date(); var h=today. get. Hours(); var m=today. get. Minutes(); var s=today. get. Seconds(); // add a zero in front of numbers<10 m=check. Time(m); s=check. Time(s); document. get. Element. By. Id('txt'). inner. HTML= h+": "+m+": "+s; t=set. Timeout('start. Time()', 500); } function check. Time(i) { if (i<10) { i="0" + i; } return i; } </script> </head> <body onload="start. Time()"> <div id="txt"></div> </body> </html>
Obiectul Math Acest obiect include constante matematice si functii. Nu este nevoie sa fie creat (instantat) un obiect Math inainte de a fi folosit. • • Proprietatile obiectului Math E - Returneaza constanta lui Euler (2. 7182. . . . ) LN 2 - Returneaza logaritm natural din 2 LN 10 - Returneaza logaritm natural din 10 LOG 2 E - Returneaza logaritm in baza 2 din E LOG 10 E - Returneaza logaritm in baza 10 din E PI - Returneaza PI SQRT 1_2 - Returneaza radical din 0. 5 SQRT 2 - Returneaza radical din 2
Obiectul Math Metodele obiectului Math: • abs(x) - Returneaza valoarea absoluta din x • ceil(x) - Returneaza cel mai apropiat intreg mai mare sau egal cu x • cos(x) - Returneaza cosinus din x • exp(x) - Returneaza valoarea lui E la puterea x • floor(x) - Returneaza cel mai apropiat intreg mai mic sau egal cu x • log(x) - Returneaza log natural din x • max(x, y) - Returneaza maximul dintre x si y • min(x, y) - Returneaza minimul dintre x si y • pow(x, y) - Returneaza valoare a lui x la puterea y • random() - Returneaza un numar aleator intre 0 si 1 • round(x) - Rotunjeste pe x la cel mai apropiat intreg • sin(x) - Returneaza sinus din x • sqrt(x) - Returneaza radical din x
Obiecte de tip Global Obiectele de tip Global grupeaza proprietatile si metodele de nivel cel mai inalt, fara un obiect parinte, cum sunt functiile. Obiectul Global are trei proprietati: Infinity - cuvant-cheie care reprezinta plus sau minus infinit Na. N - reprezinta un obiect null, care nu are vreo valoare undefined - Indica daca o variabila a fost sau nu definita
Obiecte de tip Global Metodele acestui obiect (care pot fi considerate si functii Java. Script) sunt: • escape() - Intoarce un obiect sir in care toate caracterele non alfa-numerice sunt transformate in echivalentele lor numerice • eval() - Accepta un sir de instructiuni Java Script si il evalueaza ca fiind cod sursa • is. Finite() - determina daca o variabila are limite finite • is. Na. N() - determina daca o variabila este sau nu un numar. • Number() - Converteste valoarea unui obiect in numar • parse. Float() - transforma un sir intr-un numar de tip float (cu virgula) • parse. Int() - transforma un sir intr-un numar intreg • string() - Converteste valoarea unui obiect in string (de tip sir) • unescape() - ia o valoare hexazecimala si intoarce echivalentul sau in ISOLatin-1 ASCII
Obiecte de tip Global <script type="text/javascript"> function calculeaza(form) { form. rezultat. value = eval(form. expresie. value); } eval("alert('Bine ati venit pe site!')"); </script> <form> <p>Introduceti o expresie matematica (adunare, scadere, inmultire, impartire), de exemplu (7*8 sau 3+8/2): </p> <input type="text" name="expresie" size="35" > <input type="button" name="calc" value="Calculare" onclick="calculeaza(this. form)"> Rezultatul este: <input type="text" name="rezultat" size="18"> </form>
Obiecte pe partea de client • Java. Script organizeaza toate elementele unei pagini web intr-o ierarhie. Toate elementele sunt vazute ca obiecte si fiecare obiect are anumite proprietati si metode sau alte obiecte. Java. Script înţelege fereastra browser-ului ca pe un obiect window, acesta conţine anumite elemente, cum ar fi de exemplu bara de stare (status bar). • In fereastra browser-ului poate fi încărcat (afişat) un document HTML (sau si de alt tip). Aceasta pagina din interiorul navigatorului este un obiect document.
Obiectul document toate elementele HTML sunt proprietati ale obiectului document. Sintaxa de adresare la o proprietate: this. nume_proprietate Proprietăţile: • all - tabloul tuturor etichetelor HTML din document • anchors - tabloul de obiecte "Anchor", in ordinea specificata in sursa • bgcolor - culoarea de fundal a documentului • cookie - fisier cookie asociat cu documentul • fgcolor - culoarea textului in document • forms[] - tablou de obiecte "Form" (formular) • images - tablou de obiecte "Image" • last. Modified - data cand a fost modificat ultima oara documentul • link. Color - culoarea legaturilor • links - tablou de obiecte "Link", ce corespund tuturor link-urilor HREF din document, in ordinea specificata in sursa • title - titlul documentului • URL - adresa URL a documentului curent • etc.
Obiectul document Exemplu cu proprietăţi: <script type="text/javascript"> <!-- document. bg. Color = '#eaeafe' document. fg. Color = '#fe 1111' document. link. Color = '#01 ff 01' document. title = "Lectie Java. Script" //--> </script>
Obiectul document Metodele: • capture. Events() - captureaza evenimentele care vor fi tratate de document • close() - inchide fluxul datelor de iesire spre document • contextual() - permite sa aplicam in mod selectiv un stil unui element HTML care apare intr-un anumit context specific • get. Selection() - intoarce textul selectat • handle. Event() - apeleaza handlerul pentru evenimentul specificat • open() - deschide fluxul datelor de iesire spre document • release. Events() - elibereaza evenimentele capturate de document • route. Event() - dirijeaza evenimentele capturate spre alte obiecte • write() - adauga text in document • writeln() - adauga text si un caracter linie noua in document (textul pe linia lui) • get. Element. By. Id() • get. Elements. By. Name() • get. Elements. By. Tag. Name()
Exemplu cu metode: <html> <head> <script type="text/javascript"> function create. Doc() { var doc=document. open("text/html", "replace"); var txt="<html><body>Learning about the HTML DOM is fun!</body></html>"; doc. write(txt); doc. close(); } </script> </head> <body> <input type="button" value="New document" onclick="create. Doc()" /> </body> </html>
DOM - Modelul Obiectului Document
Browser Object Model (BOM) Comunicarea între Java. Script și browser Obiectul window. document. get. Element. By. Id("header");
Obiectul window proprietatea size <!DOCTYPE html> <body> <p id="demo"></p> <script> var w=window. inner. Width // For Internet Explorer, Chrome, Firefox, Opera, and Safari || document. Element. client. Width // For Internet Explorer 8, 7, 6, 5 || document. body. client. Width; // For Internet Explorer 8, 7, 6, 5 var h=window. inner. Height // For Internet Explorer, Chrome, Firefox, Opera, and Safari || document. Element. client. Height // For Internet Explorer 8, 7, 6, 5 || document. body. client. Height; // For Internet Explorer 8, 7, 6, 5 x=document. get. Element. By. Id("demo"); x. inner. HTML="Browser inner window width: " + w + ", height: " + h + ". " </script> </body> </html>
Obiecte de nivel 1: Obiectul Navigator Proprietăţi: • app. Code. Name - reprezinta numele de cod al browserului • app. Name - reprezinta numele oficial al browserului • app. Version - versiunea browserului • language - limbajul browserului • mime. Types - face referire la un tablou de obiecte "Mimetype" care contine toate tipurile MIME pe care le accepta browserul • platform - un sir care reprezinta platforma pe care ruleaza browserul • plugins - face referire la un tablou de obiecte "Plugin" care contine toate modulele plugin instalate pe browser • user. Agent - sir care reprezinta antetul utilizator-agent Metode: • java. Enabled() - functie care testeaza daca browserul cunoaste sau nu limbajul JAVA • plugins. refresh() - cauta orice module plugin nou instalate • preference() - permite citirea si stabilirea diverselor preferinte ale utilizatorului in browser • taint. Enabled() - testeaza daca este activata contaminarea datelor
Obiecte de nivel 1: Obiectul Navigator <body> <script type="text/javascript"> <!-document. write("Nume cod : ". bold()+navigator. app. Code. Name+" "); document. write("Nume browser : ". bold()+navigator. app. Name+" "); document. write("versiune : ". bold()+navigator. app. Version+" "); document. write("limbaj : ". bold()+navigator. language+" "); document. write("MIME Type : ". bold()+navigator. mime. Types+" "); document. write("Platforma : ". bold()+navigator. platform+" "); document. write("Plugin-uri : ". bold()+navigator. plugins+" "); document. write("Agent : ". bold()+navigator. user. Agent+" "); document. close(); //--> </script> </body>
Obiecte de nivel 1: Obiectul Navigator Rezultat: Nume cod : Mozilla Nume browser : Microsoft Internet Explorer versiune : 4. 0 (compatible; MSIE 8. 0; Windows NT 6. 1; WOW 64; Trident/4. 0; SLCC 2; . NET CLR 2. 0. 50727; . NET CLR 3. 5. 30729; . NET CLR 3. 0. 30729; Media Center PC 6. 0; . NET 4. 0 C) limbaj : undefined MIME Type : Platforma : Win 32 Plugin-uri : [object] Agent : Mozilla/4. 0 (compatible; MSIE 8. 0; Windows NT 6. 1; WOW 64; Trident/4. 0; SLCC 2; . NET CLR 2. 0. 50727; . NET CLR 3. 5. 30729; . NET CLR 3. 0. 30729; Media Center PC 6. 0; . NET 4. 0 C)
Acces la obiectele documentului nume_var = document. forms[0]. elements[0]. value; document. forms[0]. elements[0]. value = nume_var; sau nume_var = document. get. Element. By. Id("id"). inner. HTML; document. get. Element. By. Id("id"). inner. HTML = "continut"
Obiecte de nivel 2: Obiectul Link Metoda: handle. Event() apeleaza handlerul pentru evenimentul specificat Proprietăţie: hash - reprezinta o denumire de ancora in adresa URL pentru legatura, care cu caracterul diez ( # ) host - reprezinta portiunea de calculator gazda din adresa URL asociata cu o legatura hostname - reprezinta portiunea de nume al calculatorului gazda din adresa URL asociata cu o legatura href - reprezinta adresa URL completa asociata cu o legatura pathname - reprezinta portiunea numelui de cale a legaturii URL port - reprezinta portiunea de port a legaturii URL protocol - specifica portiunea de protocol a legaturii URL search - reprezinta portiunea de interogare a legaturii URL target - reprezinta numele obiectului "Window" in care este afisata legatura x - face referire la coordonata X a legaturii y - face referire la coordonata Y a legaturii text - textul folosit pentru crearea legaturii
Obiecte de nivel 2: Obiectul Link <html> <body> <p><a id="w 3 s" href="http: //www. w 3 schools. com/">W 3 Schools</a></p> <script type="text/javascript"> document. write("Return href of link: "); document. write(document. get. Element. By. Id('w 3 s'). href); </script> </body> </html>
Obiecte de nivel 3: obiectul Button Proprietăţi: • form - returneaza obiectul Form al carui membru este butonul name - returneaza sirul specificat in atributul name al etichetei HTML <input> type - returneaza sirul specificat in atributul type al etichetei HTML <input> value - returneaza sirul care apare in reprezentarea grafica a unui buton, afisata in browser Metodele: • blur() - dezactiveaza butonul click() - apeleaza un eveniment click pentru butonul respectiv. focus() - eveniment de activare a butonului handle Event() - transfera un eveniment handlerului de eveniment corespunzator
Exemplu de manipulare a obiectelor de nivelul 3 • <html> <head> <title>Script JS</title> <script type="text/javascript"> <!-function Scrie. Div(){ val. Text = document. formular 2. text 2. value; document. get. Element. By. Id("div_id 2"). inner. HTML = val. Text; } // --> </script> </head> <body> <div id="div_id 2">Aici va apare textul din formular</div> <form name="formular 2"> <textarea cols="30" rows="5" name="text 2" id="textul 2"></textarea> <input type="button" value="Afiseaza" onclick="Scrie. Div(); " /> </form> </body> </html>
- C dezvoltat de
- C dezvoltat de
- Cine a fost melhisedec
- Liceul ionita asan
- Am fost cazut in pacat
- In mormant pus-ai fost hristoase
- Cauzele descoperirilor geografice
- A fost odata ca niciodata ca daca n-ar fi
- Cine a fost erasmus
- Ce este istoria
- Istoria romilor
- Istoria spaniei
- Evolutia calculatoarelor
- Istoria fizicii
- Caracteristicile internetului
- Istoria berlinului
- Istoria religiilor
- Icoana aceasta inchipuitoare
- Aflati numerele intregi x pentru care au loc egalitatile
- Cele 14 nevoi fundamentale lucretia titirca
- Istoria telefonului mobil
- Atomul este incarcat electric pozitiv
- Definitia internetului
- Broqsis istoria
- Riad wahby
- "java script"
- "java script"
- Java script email
- Java script wikipedia
- Java script classes
- Khan academy java programming
- Java script ide
- "java script"
- Java script course
- Java script examples
- Script de java
- "java script"
- "java script"
- Java script
- Inside which html element do we put the
- What is java scripts
- Import java.util.
- Java compiler translates java source code into
- Import java.applet.applet
- Import java.util.scanner;
- Java thread import
- Ejb javatpoint
- Import java.util.scanner;
- Java random
- Perbedaan antara java swing dan awt adalah
- Java import java.util.*
- Java import java.io.*
- Import java.awt.event.*;
- Java import java.util.*
- Java 讀檔
- /html/body/script[1]
- How to welcome tourists
- Scripting template
- Script adalah
- Macromedia action
- Headway 2
- Jasper report parameter
- Shampoo advertisement analysis
- Nmap http-enum
- 5 serving sequence guests
- Teamstepps desc script
- Signing naturally 6.13 answers
- Book talk script
- Words with the greek root graph
- Contoh logline
- Dramatic speech
- Drugstore script readyfill
- Event introduction script
- Schema and script in discourse analysis
- Hotel booking english conversation
- Poltergeist screenplay
- Script format
- Eagle scout pledge
- Matlab functions in script
- Gelscripting
- Sorry wrong number by lucille fletcher
- Listening script
- The monsters are due on maple street exposition
- Romeo romeo where art thou romeo script
- Wise script editor
- Nagsisilbing mekanismo ng pagbabago ng kulturang pilipino
- Xmouse script
- Morality play characteristics
- Adjust indirect fire
- Script data pada scratch
- What is sexual script
- Brookhaven gui
- Restorative justice script
- Wml script examples
- Cooking show script
- Play script
- A skit example
- Romeo and juliet summary act 5
- Monologue inspiration