CAP. 11. JAVA ŞI JAVASCRIPT

11.1. Noţiuni generale

Vom începe acest capitol prin a face distincţia Java şi JavaScript.

Java este un limbaj de programare orientat-obiect, ce se adresează programatorilor avansaţi putând fi rulat fără modificări pe orice computer (PC, PDA etc) pe care există instalată o "maşină virtuală" Java (JVM=Java Virtual Machine), fiind extrem de potrivit, deşi nu exclusiv, pentru Internet.

Pe de altă parte, JavaScript este un limbaj de programare orientat-obiect bazat pe conceptul prototipurilor. Limbajul este binecunoscut pentru folosirea în construirea siturilor web, dar de asemenea este folosit pentru acesul la obiecte încastrate (embedded objects) în alte aplicaţii.

În ciuda numelui şi a unor oarecare similarităţi în sintaxă, între JavaScript şi limbajul Java nu există nici o legătură. Ca şi Java, JavaScript are o sintaxă asemănătoare cu cea a limbajului C, dar are mai multe în comun cu Limbajul de Autoprogramare decât cu Java.

11.2. Limbajul JAVA

Java este un limbaj de programare conceput de Sun Microsystems la începutul anilor 90.

A fost conceput ca un limbaj de programare orientat-obiect foarte puternic, "cross-platform" şi "device-independent", ceea ce înseamnă că programul compilat trebuie să ruleze atât pe PC-uri, MAC-uri sau calculatoare cu platformă UNIX.

Browser-ele creează un mediu pentru rularea applet-urilor Java, numit Java Virtual Machine. Acesta oferă independenţa platformei pentru applet-urile Java.

Denumirea de applet se referă la orice mini-aplicaţie creată cu ajutorul limbajului Java. Creare unui applet nu face obiectul acestui ghid. Applet-urile sunt programe compilate separate ce au extensia ".class". Acestea sunt descărcate împreună cu pagina web prin folosirea tag-ului <APPLET>.

Sintaxa HTML pentru folosirea tag-ului <APPLET> şi a tag-ului său asociat <PARAM>, este următoarea:

< APPLET

[CODEBASE = directorApplet]

[CODE = clasaApplet]

[ALT = textAlternativ]

[NAME = numeInstanţăApplet]

WIDTH = lăţimeInPixeli

HEIGHT = înălţimeInPixeli

[ALIGN = aliniere]

[VSPACE = spaţiuVertical]

[HSPACE = spaţiuOrizontal] >

[< PARAM NAME = numeParametru_1 VALUE = valoare_1 >]

. . .

[< PARAM NAME = numeParametru_n VALUE = valoare_n >]

[text HTML alternativ]

</APPLET>

Atributele puse între paranteze pătrate sunt opţionale. Semnificaţia atributelor este următoarea:

Atribut	Valoare	Descriere
align	left right top bottom middle baseline texttop absmiddle absbottom	Semnifică modalitatea de aliniere a appletul-ui în pagina Web, semnificaţiile lor fiind aceleaşi ca şi la tag-ul <IMG>.
alt	text	Specifică textul ce trebuie afişat dacă browser-ul înţelege tag-ul APPLET dar nu poate rula applet-uri Java.
code	URL	Specifică numele fişierului ce conţine clasa principală a applet-ului. Acesta va fi căutat în directorul specificat de CODEBASE.
codebase	URL	Specifică URL-ul în care se găseşte clasa applet-ului. Uzual se exprimă relativ la directorul documentului HTML. În cazul în care lipseşte, se consideră implicit URL-ul documentului.
height	pixeli	Specifică înălţimea suprafeţei în care va fi afişat applet-ul. Este un atribut obligatoriu.
hspace	pixeli	Specifică numărul de pixeli dintre applet şi marginile orizontale ale suprafeţei de afişare.
name	text	Oferă posibilitatea de a da un nume respectivei instanţe a applet-ului, astfel încât mai multe applet-uri aflate pe aceeaşi pagină să comunice între ele folosindu-se de numele lor.
vspace	pixeli	Specifică numărul de pixeli dintre applet şi marginile verticale ale suprafeţei de afişare.
width	pixeli	Specifică lăţimea suprafeţei în care va fi afişat applet-ul. Este un atribut obligatoriu.

< PARAM NAME = numeParametru1 VALUE = valoare1 >

Tag-urile <PARAM> sunt folosite pentru specificarea parametrilor unui applet. Aceşti parametri permit utilizatorului să personalizeze aspectul sau comportarea unui applet fara a-i schimba codul si recompila clasele.

text HTML alternativ

Este textul ce va fi afişat în cazul în care browser-ul nu înţelege tag-ul <APPLET>. Browser-ele care înţeleg Java vor ignora acest text.

11.3. Limbajul JAVASCRIPT

JavaScript vă permite să creaţi o interfaţă activă cu utilizatorul, să dea o impresie vizuală plăcută în timp ce navigaţi prin paginile site-ului. Puteţi verifica validitatea informaţiilor introduse într-un formular înainte ca datele să fie trimise către server. Puteţi face calcule matematice, crea pagini HTML dinamice, personalizate în funcţie de opţiunile utilizatorului sau al browser-ului.

JavaScript controlează browser-ul, şi prin intermediul scripturilor puteţi deschide ferestre noi, puteţi afişa mesaje de avertizare şi puteţi pune mesaje în bara de stare a ferestrei browserului. Puteţi genera ceasuri, calendare şi documente cu timpul înscris. Puteţi chiar verifica prezenţa plug-in-urilor în browser, şi puteţi redirecta utilizatorul spre o pagină diferită în cazul în care browserul nu are un anumit plug-in.

O menţiune importantă: programele care rulează pe calculatorul utilizatorului sunt numite aplicaţii client-side (aflate pe partea de client), şi programele care rulează pe server (inclusiv CGI-urile) sunt numite aplicaţii server-side (aflate pe partea de server)

Deoarece JavaScript rulează pe calculatorul dumneavoastră, i-au fost impuse o serie de limitări, majoritatea din raţiuni de securitate, şi anume:

- nu permite citirea sau scrierea de fişiere pe calculatorul utilizatorului. Singura excepţie este permisiunea de a scrie în directorul de cookie-uri al browserului, dar şi aici sunt anumite limite.

- nu permite citirea/scrierea de fişiere pe server. Alternativa este să rulaţi pe server un program care să preia datele trimise de script şi să le scrie pe server (un CGI, scris într-un limbaj precum Perl sau PHP, sau un program Java.

- un script JavaScript nu poate închide o fereastră de browser care nu a fost deschisă de el. Astfel se evită situaţia când intraţi pe un site şi vi se închid celelalte ferestre active care conţin alte site-uri...

- nu poate citi informaţii dintr-un browser care conţine o pagina web de pe un alt server, ca să nu puteţi afla pe ce site-uri navigează utilizatorul.

Un script JavaScript este un program inclus într-o pagina HTML. Deoarece este încadrat de tag-ul <script>, textul scriptului nu apare pe ecran, dar este rulat şi interpretat de către browser. Tag-ul <script> este prezent cel mai frecvent în secţiunea <head> a paginii HTML, deşi se pot pune şi în secţiunea <body>. De obicei, scripturile care urmează să afişeze mesaje pe ecran sunt scrise în <body>.

Vă prezentăm în continuare o listă a atributelor ce pot fi adăugate tag-urilor HTML pentru a defini diferite acţiuni:

- Acţiuni legate de ferestre

Valabile numai în elementele <BODY> şi <FRAMESET>

Atribut	Valoare	Descriere
onload	script	Scriptul ce va fi rulat la încărcarea documentului
onunload	script	Scriptul ce va fi rulat la închiderea documentului

- Acţiuni legate de formulare

Valabile numai în elementul <FORM>

Atribut	Valoare	Descriere
onchange	script	Scriptul ce va fi rulat când se elementul se schimbă
onsubmit	script	Scriptul ce va fi rulat la trimiterea formularului
onreset	script	Scriptul ce va fi rulat la resetarea formularului
onselect	script	Scriptul ce va fi rulat la selectarea elementului
onblur	script	Scriptul ce va fi rulat la pierderea focalizării asupra elementului
onfocus	script	Scriptul ce va fi rulat la focalizarea asupra elementului

- Acţiuni legate de tastatură

Nu sunt valabile în elementele <BASE>, <BDO>, <BR>, <FRAME>, <FRAMESET>, <HEAD>, <HTML>, <IFRAME>, <META>, <PARAM>, <SCRIPT>, <STYLE> şi <TITLE>.

Atribut	Valoare	Descriere
onkeydown	script	Scriptul ce va fi rulat când este apăsată o tastă
onkeypress	script	Scriptul ce va fi rulat când este apăsată şi eliberată o tastă
onkeyup	script	Scriptul ce va fi rulat când este eliberată o tastă

- Acţiuni legate de mouse

Nu sunt valabile în elementele <BASE>, <BDO>, <BR>, <FRAME>, <FRAMESET>, <HEAD>, <HTML>, <IFRAME>, <META>, <PARAM>, <SCRIPT>, <STYLE> şi <TITLE>.

Atribut	Valoare	Descriere
onclick	script	Scriptul ce va fi rulat când se face click cu mouse-ul
ondblclick	script	Scriptul ce va fi rulat când se face dublu-click cu mouse-ul
onmousedown	script	Scriptul ce va fi rulat când este apăsat butonul mouse-ului
onmousemove	script	Scriptul ce va fi rulat când este mişcat cursorul de la mouse
onmouseout	script	Scriptul ce va fi rulat când cursorul de la mouse este mutat în afara unui element
onmouseover	script	Scriptul ce va fi rulat când cursorul de la mouse este mutat asupra unui element
onmouseup	script	Scriptul ce va fi rulat când este eliberat butonul mouse-ului

11.4. Aplicaţie practică

Pentru a exemplifica cele arătate mai sus, vom crea un fişier test11.html ce va conţine două applet-uri Java şi un script Javascript.

<HTML>

<HEAD>

<TITLE>Java si Javascript</TITLE>

</HEAD>

<BODY>

<P ALIGN="center"> Iata un applet simplu ce reproduce functiile unui calculator.<BR><BR>

<APPLET CODE="AdderApplet.class" WIDTH="175" HEIGHT="175">

</APPLET><BR><BR>

Iata un applet ce reproduce un calendar si foloseste diversi parametri.<BR><BR>

<APPLET CODEBASE="C:\Ghid programare HTML\Teste" CODE="tcaldate.class" WIDTH="200" HEIGHT="170">

<PARAM NAME="font" VALUE="Arial">

<PARAM NAME="fontsize" VALUE="12">

<PARAM NAME="fontstyle" VALUE="1">

<PARAM NAME="bgcolor" VALUE="13684944">

<PARAM NAME="bgcolor2" VALUE="14737663">

<PARAM NAME="bgcolor3" VALUE="400">

<PARAM NAME="_min" VALUE="01 Ian 2008">

<PARAM NAME="current" VALUE="1z5 zzIan 08">

<PARAM NAME="_max" VALUE="31 Ian 2008">

<PARAM NAME="t_col1" VALUE="400">

<PARAM NAME="t_col2" VALUE="8421520">

<PARAM NAME="t_col3" VALUE="14737663">

</APPLET><BR><BR>

Iata un script ce schimba doua imagini intre ele in functie de pozitia mouse-ului.<BR><BR>

<SCRIPT LANGUAGE="JavaScript">

<!-- Acest text nu va fi afisat de browserele ce nu suporta JavaScript

image_1aon = new Image(150, 50);

image_1aon.src = "picture1b.gif";

image_1aoff = new Image(150, 50);

image_1aoff.src = "picture1.gif";

// Functii

function

img_act(imgName) {

imgon = eval(imgName + "on.src");

document [imgName].src = imgon;

}

function

img_inact(imgName) {

imgoff = eval(imgName + "off.src");

document [imgName].src = imgoff;

}

--></SCRIPT>

<A HREF="test11.html" ONMOUSEOVER="img_act('image_1a')"

ONMOUSEOUT="img_inact('image_1a')"><IMG

SRC="picture1b.gif" BORDER="0"

WIDTH="80" HEIGHT="50" NAME="image_1a"></A>

</P>

</BODY>

</HTML>

Rezultatul afişat în browser-ul IE va fi următorul: