5 XML Si Java Script

PROGRAMARE HTML, XML

CAPITOLUL IX

JavaScript [32, 70, 84],

Combinarea tabelelor cu cadrele şi cu alte elemente HTML oferă o ga-

mă largă de instrumente pentru realizarea de pagini WEB, dar toate sunt li-

mitate la lucrul într-o singură dimensiune: totul se petrece pe o coală de hăr-

tie. Marcajele permit obţinerea unei dispuneri sofisticate a elementelor pe

pagină, dar acele elemente nu pot fi plasate unele peste altele.

Cu JavaScript, paginile de casă devin mai inteligente, deoarece răs-

pund la diferitele acţiuni efectuate cu mouse-ul, cu tastatura sau pentru că

au fost prescrise o serie de acţiuni prin instrucţiunile adăugate în cadrul fişie-

rului cu extensia .html, pe partea de client.

9.1 Introducere in Java Script [70, 84]

JavaScript a adăugat o mai multă interactivitate şi funcţionalitate

paginilor de casă. Până la apariţia sa, singurul mijloc îl ofereau unul din lim-

bajele de tip script: Perl, oricare din cele trei shell-uri Unix (C-shell, Bourne-

shell, Korn-shell) sau VBScript (Visual Basic Script). Toate limbajele de tip

script (care se mai numesc şi ″limbaje pentru scenarii″) respectă o interfaţă

comună, cunoscută sub prescurtarea CGI (Common Gateway Interface).

JavaScript este mai simplu decât Java, mai puţin dotat decât acesta, şi

totuşi se bazează pe Java. Este mai apropiat de acesta decât de marcajele


HTML. Dacă Java permite scrierea de aplicaţii de sine stătătoare (stand

alone) sau ″compilate″, JavaScript nu permite acest lucru pe partea de

client. JavaScript permite cunoscătorului HTML să trateze cu secvenţe de

program adecvate, diverse evenimente iniţiate de către utilizator cum ar fi:

efectuarea unui clic cu mouse-ul, ″survolarea″ cu mouse-ul a anumitor zone

ale unei ″hărţi″ afişate, completarea unui formular sau acţionarea unui buton,

conturat pe ecran; organizează ferestre în mai multe cadre, fiecare punctând

spre un document din spaţiul Web. Într-un cuvânt, face răsfoirea unui volum

mare de informaţii mult mai umană pentru utilizator.

Fiind pregătit pentru arhitectura client-server, pe ecranul unde rulează

clientul poate apărea un formular cu felurite câmpuri, unde utilizatorul pre-

cizează diferite informaţii sau alege anumite opţiuni. La efectuarea unui clic

pe butonul de tip submit, răspunsurile utilizatorului pentru acest formular

sunt expediate la server, care le prelucrează.

JavaScript are o sintaxă asemănătoare limbajului C. Prima atenţionare

care trebuie făcută este că, spre deosebire de HTML, de altfel ca şi C++,

JavaScript este case sensitive, adică face distincţia între literele mari şi

cele mici.

Scripturile JavaScript sunt interpretate de browserele Web, care recunosc

JavaScript.

Exemplu de Inserare a unui script JAVA intr-o pagina HTML:

- Se utilizeza marcajul <SCRIPT>, care este o extensie a limbajului Html.

- Language - specifica ce limbaj de scripting este utilizat in scriptul inserat;

- Pus in antetul documentului, scriptul se executa la incarcarea paginii de

catre navigator.

- Document – este un obiect predefinit, defineste caracteristicile docu-

mentului Html

- Write – este metoda, aceasta afiseaza un sir de caractere in document.


Instrucţiunile scrise cu JavaScript vor fi incluse în documentul HTML în

interiorul marcajului <SCRIPT> care este un marcaj pereche şi are marcajul

corespunzător de terminare </SCRIPT>.

9.2 Structura programelor JavaScript [70, 77, 84]

Un program în JavaScript este format din: partea principală (main), din se-

cvenţe de tratare a apariţiei anumitor evenimente şi din funcţii. Evenimentele


sunt provocate de către mişcarea mouse-lui sau a tastelor, deci în genere,

de către vizitator.

Partea principală este alcătuită din instrucţiuni ce apar în cadrul marcajului

<SCRIPT> şi care nu intră în corpul unei functii. De fapt, ca şi în limbajul

C/C++, main este funcţia principală, numai că acum lipseşte void sau int

main() { ... }, cum se scria în C/C++. Este recomandabil a forma aceasta par-

te principală cât mai redusă posibil.

Secvenţele de tratare a evenimentelor sunt "trezite" şi puse să răspundă

la acţiunile pe care vizitatorul paginii de casă le întreprinde., exemlu: at-

ributul ONCLICK="nume-de-functie()".

Funcţiile sunt scurte secvenţe de program ce pot fi apelate de către alte

funcţii, deci şi de partea principală a programului, care poate fi socotită tot o

funcţie. Funcţia are un nume care este precedat de cuvântul function. Dupa

nume urmeaza, intre o pereche de paranteze rotunde, lista parametrilor for-

mali, cărora li se atribuie în mod poziţional valorile reale ale argumentelor

din lista de apel.

Putem atribui valori şi invers, dinspre funcţie spre secvenţa care a apelat-o.

9.3 Elementele de bază ale limbajului [70, 84]

Variabilele, comentariile şi constantele se declara ca si in C/C++ cu ur-

matoarele nuantari:

-- comentariile in JavaScript acceptă şi forma canonică a limbajului C

de comentariu /* text pe mai multe rânduri consecutive */ , oferind o

oarecare relaxare, în sensul că textul explicativ poate fi continuat pe oricâte

linii de text ca in exemplul urmator:

/* Acesta este un comentariu în JavaScript care poate fi folosit şi pentru

programele scrise cu C. */


-- datele scrise între ghilimele se numesc literali. Un literal este

aşadar scris ca un "grup de cuvinte încadrat de ghilimele terminale".

Literalii pot fi definiţi şi astfel: 'grup de cuvinte încadrat de apo-

stroafe'. Nu se admit mixturi de genul: "text”. sau 'text". Pentru a include

ghilimelele în cadrul textului, se recurge la caracterul special \ , deci se va

scrie \". Apostroafele sunt admise între ghilimele, şi reciproc.

- denumirile variabilelor nu vor fi admise să înceapă cu cifre sau semne

speciale. Ele pot începe însă cu semnul ″_″ sau cu o literă alfabetică.

- fiecare variabilă are un domeniu al său unde este recunoscută.

Deoarece JavaScript este un limbaj în care nu se pot declara (ca în C++/ C)

tipurile variabilelor folosite, la momentul interpretării se stabileşte din context

daca tipul datei coincide cu operatorul sau funcţia care i se aplică asa cum

se vede pe urmatoarea secventa:

var a = 100 // aici a este o variabila numerica

x=100+a // x va lua valoarea 200

a="scripturi" // a poate fi redefinit ca variabila de tip sir

x="100" + a // aici se vor obtine 100 scripturi

În continuare este prezentat un mic program JavaScript, în care apare şi o

parte de dialog. Este de fapt un formular în care vizitatorul va specifica para-

metrul razaCerc şi în alt câmp va primi răspunsul, adică lungimea sa.

Urmează sursa:


După ce a fost precizată valoarea razei cercului, când se efectuează un clic

pe butonul ″Declanşaţi calculul″, în caseta cu denumirea internă Lungime-

Cerc se va anunţa valoarea calculată.

- JavaScript foloseşte si tipul de date logic. Valorile literalilor booleeni

sunt: "false" (valoare falsa) şi "true" (adevărată).

- dintre constantele speciale folosite în JavaScript mentionăm: secvenţele

care încep cu bara inversă denumite şi secvenţe escape: \b (înapoi un

caracter, backspace), \f (avans la linia nouă, line feed), \n (o linie nouă,

new line), \r (întoarce carul, carriage return), \t (caracterul de tabulare ori-

zontală, tab) şi \" (inserează ghilimele în şirul literal).

Expresiile şi operatorii sunt ca si in C++ cu urmatoarele nuantari:

- se pot efectua atribuiri multiple de forma: v=v1=…=vn=expresie, unde v1,

…,vn sunt variabile in care principiul de executare este evident. Atribui-

rea este un operator care figurează într-o expresie. Ca orice expresie,

aceasta are o valoare rezultată în urma evaluării. În cazul atribuirilor, va-


loarea rezultată este valoarea atribuită variabilei care este prima din

stânga într-un şir de atribuiri.

- operatorii relaţionali sunt operatori binari, care întorc o valoare logică,

true dacă relaţia este adevărată, sau false, dacă relaţia nu este adevăra-

tă.

- pentru conversii forţate şir -> număr se folosesc două funcţii: parseInt()

şi parseFloat(). Fiecare va converti un şir într-un număr, prima, într-unul

de tip întreg, a doua, într-unul de tip real, fireşte, dacă acest lucru este

posibil. Secvenţa de mai jos exemplifică acest lucru:

var a = "1000" //definim literalul 1000

b = parseInt(a) //b va avea valoarea întreagă 1000

var a = "Java"

b = parseInt(a) //se va solda cu mesaj de eroare

var a = "123.45"

b = parseFloat(a) //b va avea valoarea numerică 123,45

- datele octale, adică cele scrise în baza sistemului de numeraţie 8, vor în-

cepe obligatoriu cu cifra 0. Deci, numărul 0123 va fi considerat numărul

123 în baza 8 şi nu în baza 10.De fapt, valoarea zecimală a lui 0123 va fi

1x82 + 2x 81+ 3 = 64 + 16 = 83.

- in JavaScript se poate amâna interpretarea unei expresii, până când viz-

itatorul va specifica expresia şi apoi va apela la serviciile funcţiei eval()

pentru a calcula cât este, aşa cum rezultă din următorul program

amplasat în contextul unui document html:


Instrucţiunile limbajului JavaScript sunt cele de la C++ având aceiaşi sin-

taxă şi semantică .


9.4 Obiectele limbajului JavaScript [32, 70, 77]

Obiectul are o serie de caracteristici (proprietăţi) si o serie de funcţii.

Există şi obiecte al căror conţinut nu se schimbă numite obiecte statice. Mai

există şi obiecte create de programator, care, ca şi unele dintre obiectele Ja-

vaScript, trebuie instanţiate.

JavaScript este un limbaj "bazat" şi nu "orientat" pe obiecte, aşa cum

este C++ care face parte din generaţia a 4-a (4GL). În programarea orienta-

tă pe obiect întâlnim o mulţime de limbaje, unele orientate pe clase, altele,

numai pe obiecte, altele, pe ambele. Conceptul, destul de vechi a apărut prin

1967 la Palo Alto, în cadrul companiei XEROX, prin limbajul Smaltalk

Programarea orientată pe obiect a coincis cu perioada limbajelor din

generatia a patra. Ea a adus cu sine o economie de timp pentru rescrierea

codului, prin reutilizarea codurilor scrise, conducând în final la creşterea efi-

cienţei muncii de concepere. Dacă în perioada limbajelor 3GL, FORTRAN-ul

alături de COBOL şi PL/l alcătuiau fondul de limbaje foarte populare, în pe-

rioada 4GL întălnim: C++, CLOS (Common LISP Object System), Object

Pascal, Eiffel (un fel de Pascal foarte reuşit); apoi treptat trec pe obiecte şi

Cobol-ul, şi Basic-ul (Microsoft Visual Basic sau Microsoft VB for Applica-

tions, un dialect VB folosit în MS Excel) etc. Nu putem încheia enumerarea

fără Java, primul limbaj orientat pe obiecte pentru mediul de reţea.

Un obiect apare ca urmare a procesului de instanţiere a unui şablon

de date, numit clasă. Acest şablon poate fi considerat drept un sertar, în ca-

re se găsesc o serie de despărţituri - unele pentru păstrarea datelor, altele

pentru diverse funcţii folosite în tratarea acestor date.

În programarea orientată pe obiect (OOP - Object Oriented Program-

ming) aceste funcţii se numesc metode. De pildă, autobuzul este un obiect,

avionul este altul, autoturismul este altul, etc.. Toate derivă din clasa vehicu-

le, care la rândul lor derivă din clasa mijloace. Există mijloace care nu sunt


deplasabile pe teren precum racheta şi altele deplasabile pe pământ precum

cele de mai sus. Se observă deci o ierarhie a obiectelor. Putem considera

şablonul, de exemplu al unui avion, drept proiectul său de construcţie. Se

spune despre un obiect că posedă o serie de proprietăţi, aşa cum ar fi auto-

turismul care are o anumită greutate, un anumit număr de cai putere, dezvol-

tă o anumită viteză, etc..

Obiectele conţin o serie de funcţii (metode), de asemenea încapsula-

te. Exemplu obiectul Math din JavaScript al carui conţinut se referă, la anu-

mite valori caracteristice, (cărora li se spune proprietăţi) sau funcţii frecvent

folosite. Dintre proprietăţile sale enumerăm: Math.E - valoarea numărului e,

Math.ln2- valoarea logaritmului neperian al cifrei 2, (adică 0,693), Math.ln10-

valoarea pentru ln10, (deci 2,302); Math.PI ( π=3.14); etc. Dar Math conţine

şi o serie de metode pentru calculul funcţiilor trigonometice directe precum:

Math.sin, Math.cos, Math.tan; sau inverse precum: Math.asin, Math.acos,

Math.atan, Math.atan2; pentru rotunjirea valorilor: Math.ceil (de exemplu

ceil(l23,67) va da 124) sau Math.floor (de exemplu, floor(l23,67) va da 123).

Mai întălnim: Math.log, Math.min(v1,v2), Math.max(v1,v2), Math.random

pentru generarea numerelor aleatoare cu distribuţia uniformă. Există şi

Math.round (de exemplu, round(66,45) dă 66, dar round(66, 51) va da 67)

etc.

Se observă că proprietăţile ca si metodele sunt unite prin intermediul ope-

ratorului punct (.) de clasa respectivă. În limbajul JavaScript se preferă de-

numirea de obiect în locul celei de clasă.

0 definiţie a obiectului, ar putea fi următoarea: obiectul este o entitate,

o structură abstractă de date, constituită din proprietăţi şi metode. Pro-

prietăţile se pot asimila datelor (constante sau variabile), iar metodele,

funcţiilor.

Spunem că JavaScript nu este decât bazat pe obiecte, nu şi orientat

spre ele pentru că obiectelor acestui limbaj le lipsesc 3 caracteristici ale teo-


riei OOP (Object Oriented Programming): moştenirea, încapsularea şi abs-

tractizarea.

Corporaţia Netscape Communication a definit propriul concept, cu-

noscut sub numele JavaScript Object Model (JOM). JOM conţine totalita-

tea obiectelor, proprietăţilor, metodelor dar şi variabilelor şi funcţiilor din uni-

versul Netscape. Obiectele Netscape nu trebuie confundate cu cele ale lim-

bajului JavaScript. Aceeaşi corporaţie a lansat programul de navigare Nets-

cape Navigator, pentru partea client. Tot ea a creat şi o serie de versiuni

pentru partea de server. Este vorba despre: Netscape Entreprise System

(platforma Unix), Netscape LiveWire (platforma Windows/NT) sau Netscape

Server System. Fiecare dintre aceste categorii de programe operează cu o

serie de obiecte specifice.

In cele ce urmează numim partea client, pe scurt Navigator, şi partea

server, pe scurt LiveWire.

Pe partea Navigator se pot folosi o serie de obiecte conţinute în în-

suşi acest JavaScript Object Model, dar se pot defini şi altele proprii. Pe

osatura unui document HTML se folosesc facilităţile limbajului JavaScript şi

se pot afişa o serie de ferestre, cadre, casete de dialog, unde să apară tot

felul de mesaje, resurse grafice. Se pot valida sau evalua expresii în care

apar şi variabile, nu numai date numerice sau literali, se pot chiar prelucra

date sosite de la LiveWire.

Pe partea LiveWire, în JavaScript există posibilitatea de a scrie sce-

narii în care să fie procesate toate solicitările sosite de la diferiţi clienti (diferi-

te programe de vizitare care recurg la JavaScript), care trimit informaţii ceru-

te prin aceste scenarii, sau de a accesa server-e de baze de date, pentru

fişiere sau care conţin biblioteci de aplicaţii scrise în C, Java etc. Se pot

chiar adapta diverse aplicaţii de tip applet scrise în limbajul Java.

9.5 Definirea şi folosirea propriilor obiecte în JavaScript[70]


JavaScript dispune de o serie de obiecte ale sale care organizează o

serie de date, dar şi funcţii (metode) ce operează asupra acestor date. Aces-

te obiecte - unele deja existente în JavaScript, altele create de utilizator - pot

fi cuplate, între ele sau legate de elementele HTML dând posibilitatea efec-

tuării diverselor calcule matematice sau creării diferitelor resurse: text, feres-

tre, formulare, cadre etc. Sintaxa generală pentru folosirea unei anumite pro-

prietăţi a unui obiect este:

numeObiect.numeProprietate.

In JavaScript un obiect propriu se crează parcurgând două etape: definirea

obiectului şi crearea(instanţierea) obiectului.

Exemplu. Definim obiectul Autoturism cu funcţia auto() care are 3 pa-

rametri: tip, viteză, an fabricaţie, prin secvenţa:

function auto (sTip, iViteza, iAn)

{this.Tip=sTip;

this.Viteza=iViteza;

this.AnFab=iAn;}

La definirea obiectului se poate atasa, pentru denumiri câte o literă de

început care anunţă tipul variabilei: s - şir, i - număr întreg. Cuvântul rezervat

this. este un operator cu care se face referire la obiectul curent.

Instanţierea obiectelor în JavaScript se face prin operatorul new (în-

tocmai ca în C++).

Pentru obiectul Autoturism definit mai sus putem acum instanţia oricate

obiecte de acest tip, sub următoarea formă:

AutoturismA=new auto(“Cielo”,180, 1995)

AutoturismB=new auto(“Dacia”, 120, 2003)

AutoturismC=new auto(“Ford”, 200, 2000)

Putem crea oricâte astfel de obiecte. Instrucţiunile de atribuire de mai sus

seamănă cu cele ale unui constructor din C++. Operatorul new va aloca re-


sursele (de memorie) necesare pentru întreaga structură de date a obiectu-

lui.

Adăugăm şi o metodă obiectului Autoturism care calculează numărul

de km parcurşi de acesta. Parametrul intern al obiectului afectat de această

funcţie în sensul creşterii sale este Lungime . Rescriem funcţia auto(), ca să

anunţăm şi metoda Parcurs ca membră a acestui obiect:

function auto(sTip, iViteza, iAn)

{ this.Tip = sTip,.

this.Viteza = iViteza;

this. AnFab = iAn:

this.Lungime = 0;

this.Parcurs = Parcurs: }

Codul metodei Parcurs ar putea fi de forma:

function Parcurs(iKm) {

this.Lungime =this.Lungime +i Km;

9.6 Obiecte specifice limbajului JavaScript [70, 77, 84]

Obiectui Date este destinat manevrării datelor calendaristice dar şi

orei, pentru afişarea în cadrul paginii de casă. Acest obiect nu posedă pro-

prietăţi, în schimb are vreo 20 de metode, şi nu se pot prelucra date anteri-

oare anului 1970.

Un obiect Date se creează astfel: dataDeAzi = new Date;

Metodele sunt apelate prin constructia:

nume-obiect-tip-Date.nume-metoda.

Obiectele statice sunt cele care nu se schimba. Math este un ast-

fel de obiect, deoarece el nu se schimbă, cum se întâmplă în cazul obiectu-

lui Date. Obiectele statice nu trebuie instanţiate. Astfel prin:


var numarAleator = Math.random()

am atribuit variabilei numarAleator o valoare aleatoare generată cu metoda

random a obiectului Math. Algoritmul ascuns în random asigură generarea

unui număr aleator cu distribuţia uniformă în mulţimea [0,1). Dacă dorim să

generăm numere aleatoare între doua limite, nl şi n2, vom scrie:

var numarAleator = n1 + (n2-n1)* Math.random()

Orice proprietate a unui obiect static poate fi accesată prin construcţia:

obiect-static. proprietate

Scopul (adica domeniul unde denumirea unui obiect este recunoscu-

tă) unui obiect diferă în funcţie de aplicaţie. Pentru partea Navigator, obiectul

este recunoscut în pagina curentă de casă, în care a existat scenariul cu

obiectul respectiv. În contextul LiveWire, un obiect poate fi recunoscut şi în

alte pagini de casă, nu numai în pagina curentă.

Obiectul string este de asemenea un obiect static si se referă la şi-

ruri de caractere ce pot fi afişate cu diferite caracteristici tipografice. Singura

proprietate a acestui obiect este numită length, adică lungime, şi cuprinde

numărul caracterelor (litere, cifre, semne speciale) pe care le conţine obiec-

tul la un moment dat. Metodele obiectului string şi semnificaţiile lor sunt [70]:

anchor() Va crea un text pe post de ancoră

big() Şirul va fi afişat cu un corp de literă mai mare

blink() Şirul căruia i se aplică va pulsa

bold() Şirul va apărea cu caractere îngroşate

charAt() Preia un caracter din şir care fusese adresat prin inter-

mediul unui index

fixed() Are efectul similar cu al marcajului <TT>

fontsize() Stabileşte mărimea corpului de literă cu care va fi

afişat pe ecran şirul respectiv

indexOf() Preia valoarea offset-ului acelui caracter care este

căutat într-un şir, plecând de la valoarea fromIndex

italics() Similar marcajului <I>


lastIndexOf() Se caută ultima apariţie a unui caracter într-un şir.

Valoarea acelui index va fi conţinută de acest para-

metru

link() Creează o legătură de tip hipertext. Similar cu <A

HREF…> spre o resursă de tip URL

small() Afişează şirul cu corp mic de literă

strike() Afişează şirul barat cu o liniuţă

sub() Şirul va fi afişat ca indice inferior

substring() Preia un şir parţial dintr-un şir.Parametrii ceruţi de

această metodă sunt indexA şi indexB. Ambii fixează

limitele acelui şir redus

sup() Afişează acel şir ca indice superior

toLower-

Case()

Converteşte literele alfabetice mari ale unui şir în litere

mici

toUpper-

Case()

Converteşte literele alfabetice mici ale unui şir în litere

mari

Obiectul numit masiv (array) este un grup de doua sau mai multe elemente

omogene. Prin intermediul unui indice, se poate face referire la unul din

aceste elemente. Ca si in C++ in JavaScript se consideră că indicele

porneşte de la 0. Spre deosebire de C/C++ sau Java, JavaScript nu obligă

specificarea tipului datelor.

Exemplu. Fie obiectul elev cu următoarele proprietăţi: nume, adresă, vâr-

sta, sex, clasă, şcoală, boli. Ultimul parametru nu este un şir de literali, pen-

tru că aceasta ar ocupa foarte mult, ci un nume care ascunde în el ce boli a

făcut elevul (1=pojar, 2=scarlatina, 4=oreion, 8=rujeola, 16=vărsat de vânt).

Funcţia de tip constructor a acestui obiect ar fi definită astfel:

function elev(sNume, sAdresa, iVarsta, iSex, sClasa, sScoala, sBoli

this.nume = sNume; this.adresa = sAdresa;


this.varsta = iVarsta;

this.sex = iSex;

this.Clasa = sClasa:

this.Scoala = sScoala;

this. Boli = sBoli;

Fiecare proprietate poate fi iniţializată cu valori referitoare la diverşi subiecţi.

Ca să ne referim la una dintre persoane şi, în cadrul ei, la una dintre propri-

etăţi, vom crea două obiecte de tip Elev prin secvenţa următoare:

for (i=0; i<2; i++)

{this(i)=newElev()

this(0)(0)=”Ion Bianca”

this(0)(1)=”Str. Azurului nr 13”

this(0)(2)=17

this(0)(3)=”f”

this(0)(4)=”X”

this(0)(5)=”Liceul Odobescu”

this(1)(0)=”Marin Ion”

this(1)(1)=”Str. Lujerului nr. 5”

this(1)(2)=19

this(1)(3)=”m”

this(0))(4)=”XII”

this(0)(5)=”Liceul Basarab”}

Putem accesa proprietăţile unui obiect creat sub forma:

document.write(“Varsta lui “+this(0)(0)+”este”+this(0)(2)+”<BR>”)

Acest mod de programare este destul de greoi deoarece nu apare deloc

numele explicit al obiectului. Se foloseşte operatorul this atât pentru a referi

obiectul cât şi pentru a accesa diverse proprietăţi ale acestuia, obiectul apă-

rând doar ca o listă de elemente.

Se remarcă totuşi că limbajul JavaScript admite şi maxime multidimensiona-

le în care primul indice se referă la obiect iar al doilea la proprietăţile aces-

tuia.

9.7 Funcţii proprii JavaScript [70, 32, 84]

Funcţia eval() are formatul eval(şir).


Scopul funcţiei eval() este să analizeze corectitudinea sintactică a unui şir.

Şirul poate fi orice expresie în care pot apărea şi denumiri de variabile din

acel program, care au fost analizate deja; se admit şi denumiri de proprietăţi

ale obiectelor. Funcţia nu serveşte doar la analize sintactice ci şi la calcula-

rea valorii expresiilor numerice . Şirul poate fi format din una sau mai multe

instrucţiuni.

Exemple:

alert(eval(″13+20″)); afişează 33;

a=7;

5*eval(3*++a);

alert(a); afişează 120;

alert(eval(″2″+″5″)); afişează 25;

Funcţia parseInt() are formatul : parselnt(sir, baza-de-numeratie)

Şirul şir trebuie să fie format doar din cifre, ale sistemului zecimal,

octal sau hexazecimal. El nu trebuie să aibă parte fractionară. Dacă aceasta

din urmă există totuşi, ea va fi trunchiată. În cazul în care faza de parsing

eşuează va fi anunţat un cod de eroare care este 0 pentru platforma Win-

dows şi NaN pentru platforma Unix. Aceasta se întâmplă şi când primul ca-

racter din şir nu este conform contextului.

Funcţia parseFloat() are formatul parseFloat(sir, baza-de-numeratie)

Se admit, în afara numerelor cu parte fracţionară (exemplu 10.234

sau 135. sau .135) şi numere scrise după notaţia stiinţifică, adică cu expo-

nent (exemplu: -12.45e-24). Este valabilă şi aici observaţia referitoare la co-

dul de eroare.

Funcţia escape() are formatul escape (sir)

Are rostul de a converti un şir de caractere ASCII în coduri admise de

ISO.Latin-1.


De multe ori, într-o adresă de tip URL trebuie transmis un caracter de

tabulare, tab (fie un / sau \ etc.). Nu există altă modalitate decât folosirea

acestei funcţii, dinspre limbajul JavaScript.

Funcţia unescape() are formatul unescape (sir)

Este inversă funcţiei anterioare. Va converti un şir de caractere ISO-Latin-1

în coduri ASCII.

Funcţia number are formatul number (sir)

Rolul ei este de a converti şirul în valoare numerică. În cazul în care şirul nu

se poate converti către o valoare numerică, returnează constanta de eroare

NaN (Not a Number).

Exemple.

alert(number(″13″)+number(″5.2″)); afişează 18.2

alert(number(″2x″)); afişează NaN

Funcţia isNaN

Returnează true dacă şirul nu poate fi convertit către o valoare numerică şi

false în caz contrar.

Exemple.

alert(isNaN(″23″)); returnează false

alert(isNaN(″23a″)); afişează true.

9.8 Obiectele specifice părţii client [70, 81, 84]

9.8.1 Obiectul window

Browser-ul afişează informaţiile cu ajutorul ferestrelor. El poate afişa mai

multe ferestre simultan. Obiectul window este de nivelul cel mai înalt şi are

rolul de a permite lucrul cu ferestrele. Datorită faptului că acest obiect are

nivelul cel mai înalt, nu mai este necesar să fie folosit window înaintea met-

odelor sau proprietăţilor obiectului. Instanţa unui obiect window este o


fereastră afişată de browser. Ca orice obiect, window are anumite metode

şi proprietăţi:

9.8.1.1 Metode

1. Metoda open(fişier_html, nume, parametri) are rolul de a deschide o

fereastră. Parametrii sunt:

fişier_html – adresa URL a fişerului html care este încărcat de fereastră;

nume – numele ferstrei;

parametri – mai mulţi parametri care au rolul de a specifica modul în care

va fi afişată fereastra pe ecran. Aceştia sunt:

- top – distanţa în pixeli faţă de partea de sus a ecranului la care va fi

afişată fereastra;

- left - distanţa în pixeli faţă de partea din dreapta ecranului la care va

fi afişată fereastra;

- width – lăţimea ferestrei în pixeli;

- height – înălţimea ferestrei în pixeli

- resizable – poate lua una din valorile yes sau no. Dacă ia valoarea

yes, utilizatorul poate modifica dimensiunile ferestrei;

- menubar - poate lua una din valorile yes sau no. Dacă ia valoarea

yes, fereastra afişează meniul browser-ului;

- toolbar - poate lua una din valorile yes sau no. Dacă ia valoarea

yes, fereastra afişează bara cu instrumente a browser-ului;

- status - poate lua una din valorile yes sau no. Dacă ia valoarea yes,

fereastra afişează bara de stare;

- location - poate lua una din valorile yes sau no. Dacă ia valoarea

yes, fereastra afişează edit-ul care conţine adresa fişierului html;

- copyhistory - poate lua una din valorile yes sau no. Dacă ia valoa-

rea yes, copiază istoria apelurilor ferestrei părinte.

2. Metoda close() are ca efect închiderea ferestrei curente.


În exemplul următor, la apăsarea unui buton se deschide o fereastră, iar la

apăsarea altui buton fereastra se închide:

Dacă numele ferestrei nu este precizat, metoda close() închide

fereastra curentă. Totuşi, înainte de a închide efectiv ferastra, va apărea o


casetă de dialog prin care se solicită utilizatorului să confirme dacă vrea să

închidă fereastra.

3. Metoda focus() are rolul de a activa o ferastră. O fereastră activă este vi-

zibilă pe ecran şi recepţionează evenimentele de la mouse (eventual tastatu-

ră). O fereastră poate fi activată printr-un click asupra ei, dar şi prin metoda

focus().

4. Metoda onblur() are rolul de a dezactiva o ferastră. O fereastră inactivă

poate fi aşezată pe bara de task-uri, dar poate fi şi pe ecran, caz în care

poate fi acoperită de suprafaţa altei ferestre. O ferastră poate fi dezactivată

dacă se execută click pe suprafaţa altei ferestre, dar şi cu ajutorul metodei

onblur(), caz în care ea va fi prezentă doar pe bara de task-uri.

9.8.1.2 Proprietăţi

O proprietate deosebit de utilă este status. Valoarea reţinută de această

proprietate va fi afişată pe bara de stare.

Alte proprietăţi importante sunt: document, frame, history, location. Aces-

tea sunt, la rândul lor obiecte.

Obiectul document

Este de mare complexitate şi conţine mai multe proprietăţi şi metode. Printre

acestea avem proprietatea de tip obiect all. Ea este un vector al tuturor ele-

mentelor care se găsesc pe pagină. Microsoft numeşte o astfel de proprieta-

te Colecţie, Fiecare element este tratat ca obiect. Printre elementele (obiec-

tele) care fac parte din vector găsim: HTML, HEAD, BODY, TITLE (chiar da-

că nu este trecut tag-ul respectiv), STYLE, SCRIPT, câte un element pentru

fiecare paragraf(P), imagine(IMG), etc. Fiecare element (obiect) conţinut are

o anumită proprietate, numită tagName, care reţine tipul. La rândul ei all are

mai multe proprietăţi şi metode, printre care:


length – numărul de componente ale vectorului;

metoda tags(tip) – returnează un vector al elementelor de un anumit tip.

Fiind vector, are proprietatea length, care permite adresarea tuturor ele-

mentelor;

metoda item(id) – returnează elementul (obiectul) de id dat;

anchors – vector ce reţine elementele de tip ancoră (A);

images – vector care reţine toate elementele de tip imagine (IMG);

bgColor – proprietate care reţine culoarea de fond a documentului;

fgColor – proprietate care reţine culoarea font-urilor;

linkColor – proprietate care reţine culoarea de scriere a legăturilor;

metoda write() – se foloseşte pentru scrierea integrală a unui fişier

HTML

etc.

Pe Internet se gasesc numeroase site-uri cu scripturi free. Aceste scripturi

pot fi inserate in paginile WEB create de utilizator. Imaginea urmatoare este

un exemplu de inserare a unui astfel de script free .


Codul sursa al programului care afiseaza rezultatul lungimii cercului peste

care alearga cei doi fluturi se gseste in Anexa 3. Codul pentru fluturi este

free si a fost luat de pe site-ul: www.dinamicdrive.com.


CAPITOLUL X

CSS, XML, XHTML [200, ………..],

10.1 Cateva notiuni despre limbajul de prezentare CSS

În structura unui document HTML pe langa scripturi apar si foile de stil.

O foaie de stil se creaza cu elementul STYLE, si defineste felul în care va

arăta documentul, inclusiv familia de caractere, fontul, culorile, chenarele,

marginile şi alinierea. Prin adăugarea foilor de stil, ca un element de struc-

tură al documentului, înfăţişarea şi conţinutul sunt separate.

STYLE şi SCRIPT sunt unice prin faptul că structura depinde de conţinutul

lor. Formatarea, sintaxa şi definirea stilului variază în funcţie de designer: foi

de stil în cascadă sau foi de stil JavaScript.

Foile de stil, în particular CSS – Cascading Style Sheets, descriu modul în

care documentele Web sunt prezentate pe ecran, imprimantă sau alte medii.

Ele aduc imbunatatiri paginilor WEB, fiind foarte utile in proiectarea aces-

tora.

Limbjaul CSS2 este un limbaj al foilor de stil care permite programatorilor şi

utilizatorilor să ataşeze stiluri (set de caractere, poziţionare, culoare etc.)

documentelor structurate, cum ar fi paginile HTML sau aplicaţiile XML.

Foile de stil trebuie sa fie recunoscute si interpretate de navigatoare. Specifi-

caţiile HTML definesc modul în care se utilizează HTML cu foile de stil.

Există patru moduri pentru combinarea foilor de stil cu paginile HTML:

- utilizarea elementului `LINK` pentru a face legătura către o foaie de stil

externă;

- declararea elementului `STYLE` în cadrul tag-ului `HEAD`;


- importul unei foi de stil utilizând comanda CSS`@ import`;

- asocierea atributului `STYLE` unui alt element din corpul documentului

(`BODY`).

Fiecare regulă de stil CSS este compusă din:

- selector `H1` care indică elementul sau elementele asupra cărora

acţionează regula;

- blocul declaraţiilor `color: red` care descrie condiţiile de redare fizică a

elementului specificat, fiind limitat de acolade.

Pentru a include regulile de stil într-un document HTML se utilzează

elementul STYLE.


Exemplul foloseste stilul in-line, atasat direct unui element prin atribu-

tul style.

Atributele elementului STYLE sunt:

type = tip_conţinut , specifică libajul foii de stil şi este obligatoriu, nu există o

valoare implicită.

media = descriptor media, Valoarea implicită este ”screen”. Numele ales

pentru descriptor media corespude dispozitivului pentru care proprietăţile

prezentate au sens:

- all – corespunde pentru toate dispozitivele;

- aural – sintetizator vocal;

- braille – terminal Braile;

- embossed – imprimantă Braille;

- handheld – microcalculator de buzunar: având un ecran mic, monocrom

şi conectarea în reţea se face prin modem la un debit redus;

- print – dispozitivul imprimantă;

- projection – dispozitive de protecţie pe perete;

- screen – ecranul calculatorului;

- tty – dispozitive portabile, terminale;

- tv – dispozitive de tip TV.

Este indicat ca regulile de stil să fie memorate într-un fişier extern, care

poate fi partajat de mai multe documente. Se spune ca se lucreaza cu foi de

stil definite in fisiere externe.

O foaie de stil externă poate fi scrisă cu orice alt editor de texte, nu va in-

clude nici un tag HTML şi va fi salvată cu extensia .css.

Comentariilor in CSS se introduc astfel: /* comentariu CSS */


Legătura către foaia de stil externă se asigură prin elementul LINK.

Elementul LINK are trei atribute obligatorii: type cu valoarea ”text/css”, rel cu

valoarea ’’stylesheet” si ”href” care are ca valoare URL-ul foii de stil externe

Specificaţiile oferite prin elementul LINK sunt:

Orice foaie de stil conţine o listă de comenzi, care sunt identificate din

ansamblul de reguli declarate reguli predefinite.

Regulile predefinite, ale căror nume incep cu cu simbolul `@` (at), urmat

imediat de un identificator, permit obţinerea unor funcţii care nu sunt

accesibile regulilor normale. Aceste reguli predefinite sunt:

- @page – aplică stilurile paginilor documentului;

- @import – inserează o foaie de stil externă în foaia de stil curentă;


- @media – regrupează regulile de stil care se vor aplica unuia sau mai

multor dispozitive pentru prezentarea documentului;

- @font-face – descrie setul de caractere utilizat prin foaia de stil;

- @charset – defineşte codul caracterelor utilizat prin foaia de stil.

………………………………………

10.2 XML (Extendet Markup Language)

XML este un limbaj comun folosit de tehnologiile software pentru transferul

de informatii intre diverse aplicatii din Internet. XML nu inlocuie HTML-ul.

HTML este orientat spre modul de afisare a informatiei dupa directivele

HTML, XML ofera suport pentru structurarea informatiilor.


Exemplul anterior prezinta un fisier XML editat in NOTEPAD si cum

este el structurat

In XML se pot crea etichete pentru descrierea datelor si a structurii acestora.

Etichetele XML identifica tipurile de date. In exemplu, datele se referitoare la

o eleva și folosind etichetele s-a definit structura de date.

Dacă trecem structura XML într-un fișier HTML și il deschidem cu un

browser, vedem cum acesta nu ia in seama etichetele XML si rezultatul va fi:

.


Observand exemplul anterior putem face o paralela intre cele 2 limbaje:

HTML afişeaza date , XML transporta datele

HTML defineste vizual date , XML descrie datele

HTML arăta cum datele sunt afişate , XML arăta cum datele sunt utilizate

Ideea centrală a XML este de a permite celor trei aspecte fundamentale ale

unui document: conţinut, structură şi prezentare să fie separate. Un docu-

ment HTML combină doar prezentarea şi conţinutul.

Cea mai mare parte a documentelor XML au asociate foi de stil pentru a per-

mite afişarea într-un anumit format pe ecran. Acelaşi document poate fi

prezentat în mai multe moduri. De exemplu, autorul unui document poate

asigura prezentarea informaţiei, după caz, cum ar fi:

afişarea pe ecranul unui PC, cu o anumită aranjare în pagină;

recepţionarea sonoră printr-un software specializat (sintetizator vocal),

conectarea la Web se face printr-un telefon mobil;

tipărirea pe hârtie, cu o grafică de înaltă calitate;

înregistrarea documentului într-o bază de date. Presupunem că primeşte

o comandă în format XML. O aplicaţie care înţelege XML poate utiliza

datele pentru a determina ce produse şi în ce cantităţi au fost

comandate;

afişarea într-un mod simplificat pe mini-ecranul unui calculator de

buzunar sau telefon mobil;

afişarea printr-un terminal Brille.

Avantajul acestui concept constă în faptul că niciodată nu vor trebiu schim-

bate datele documentului XML pentru generarea ieşirilor la diversele dispozi-

tive. Trebuie să se utilizeze numai concepte software diferite, care pot

furniza ieşiri într-un format particular.


Diferenţa dintre XML şi HTML este extensibilitatea XML. Aceasta se face

prin extinderea gramaticii XML, prin adăugarea de noi TAG-uri, în funcţie de

necesităţi. Limbajul HTML nu poate fi extins de utilizator, posibilităţile de îm-

bunătăţire a acestuia fiind doar prin includerea de scripturi JavaScript, VB-

Script, etc.

Un fișier XML bine formulat se conformează unui set de reguli stricte ce gu-

vernează limbajul XML. Dacă fișierul nu nu respecta regulile, XML da mesaj

de eroare.

Din punct de vedere sintactic, informaţia dintr-un document XML se descrie

asemănător cu cea dintr-un document HTML, singura deosebire fiind că în

XML, valoarea unui atribut se specifică obligatoriu între ghilimele, în HTML

acest lucru fiind opţional.

Exemplu:

Un document XML are o structură logică şi una fizică.

Din punct de vedere fizic, un document XML este format din entităţi. O enti-

tate poate face referire la o altă entitate. Documentul începe cu o structură


numită rădăcină (ROOT) sau entitate document, documentul fiind de fapt un

arbore de entităţi, începând cu entitatea rădăcină.

Din punct de vedere logic, structura acestuia este asigurată de marcaje ce

permit definirea de elemente, comentarii, declaraţii, etc.

Declaratia XML identifica versiunea specificatiei XML cu care documentul

va fi în conformitate (versiunea analizorului care va parcurge documentul

XML). Un exemplu de declaratie arata astfel: <?xml version="1.0"?>

Sau <?xml version="1.0" encoding="UTF-8" ?> În acest caz se utilizeaza

setul de caractere UTF-8.

Declaratia tipului de document se pune dupa declaratia XML , înaintea el-

ementului document.


Eemplu:

- <?xml version="1.0"?>

- <!DOCTYPE Cont SYSTEM "cont.dtd">

Liniile de cod spun procesorului XML ca documentul este din clasa Cont si

se conformeaza regulilor stabilite în fisierul Cont.dtd.

DTD-ul (Document Type Definition - definitia tipului de document) - defineste

forma si sintaxa constructiilor unui document XML dintr-o anumita clasa.

DTD este un set de reguli care definesc modul de structurare

a documentelor XML.

Standardele DTD-ului sunt definite de World Wide Web Consortium (W3C).

Un document XML poate sa aibe sau nu asociat un DTD, Acesta este intern

(definit in interiorul fisierului XML) sau extern (definit intr-un fisier separate).

Urmatorul exemplu defineste un DTD extern.


Un document XML poate fi însoţit de un document XSL (eXtensible

Stylesheet Language), care este tot un document XML ce conţine definiţiile

necesare pentru prezentarea informaţiei (din punct de vedere al afişării), pe

Web. Documentul XSL poate să conţină cod HTML, stiluri de formatare CSS

(Cascading Style Sheets), etc.

Dacă documentul XML nu este însoţit de fişierul XSL, browserul afişează di-

rect forma structurală a documentului (ca în exemplul anterior).


Obiectivele urmărite la proiectarea XML au fost: să fie simplu de utilizat pe

Internet; să suporte o mare varietate de aplicaţii; să fie compatibil cu SGML;

să fie uşor de scris programe care să prelucreze documente XML; docu-

mentele XML să poată fi concepute rapid, formal şi concis, să fie clare şi in-

terpretabile de către utilizatori;

Prin XML se separă datele care reprezintă conţinutul unui document de cele

care se referă la prezentarea acestuia. Când se utilizează HTML, datele

necesare afişării documentului sunt memorate în acelaşi fişier HTML. Uti-

lizând XML, datele pot fi stocate în fişiere XML separate de informaţia nece-

sară navigatoarelor pentru prezentare.

Prin XML datele pot fi schimbate între sisteme incompatibile. În prezent sis-

temele de calcul şi bazele de date conţin date în formate diverse, uneori in-

compatibile. Convertind datele în format XML se va reduce foarte mult

această complexitate şi se crează date care pot fi citite de diverse tipuri de

aplicaţii.

Utilizand XML: informaţia din domeniul afacerilor poate fi schimbată prin In-

ternet, astfel vor fi impulsionate tranzacţiile B2B (Business To Business);

fişierele text pot fi utilizate ca date partajate, independent de platformele

software şi hardware; datele vor fi disponibile mai multor utilizatori deoarece

XML este independent de hardware, software şi aplicaţii; datele pot fi

disponibile pentru toate tipurile de motoare de căutare (agenţi) şi în acest fel

vor ajunge mai uşor la clienţii interesaţi de aceste informaţii.

XML poate fi utilizat pentru generarea de noi limbaje. Exemplu: Wireless

Markup Language (WML), utilizat ca suport în aplicaţiile Internet destinate

dispozitivelor mobile miniaturizate scris în XML.


Pe site-ul:

http://www.siteuri.ro/developer/xml-in-10-points.ro.html

se gasesc 10 puncte de la prin care se

prezinta XML-ul, puncte enumerate in continuare, asa cum sunt prezentate

pe site .

1. XML structureaza datele (informatiile)

Prin date structurate intelegem lucruri ca spreadsheets, liste de contacte,

parametri de configuratie, tranzactii financiare sau desene tehnice. XML

- este un set de reguli pentru a crea formate text care iti permit sa

structurezi datele.

- nu este un limbaj de programare

- ajuta calculatorul la generarea , cititirea datelor, si structurarea corecta a

datelor.

- este extensibil, independent de platforma si suporta internationalizarea si

localizarea.

- este complet compatibil cu Unicode.

2. XML seamana un pic cu HTML

Ca si HTML, XML foloseste :

- tag-uri (cuvinte cuprinse in '<' si '>')

- atribute (de forma nume="valoare").

HTML specifica ce inseamna fiecare tag si atribut, si deseori cum va aparea

textul marcat cu acestea in browser.

XML foloseste taguri pentru a delimita bucati de date, lasand interpretarea

acestor date cu totul in seama aplicatiei care le citeste. Astfel, "<p>" intr-un

fisier XML, nu inseamna obligatoriu paragraf. In functie de context, poate fi

un pret, un parametru, o persoana (sau un cuvant care nici macar nu incepe

cu p).


3. XML este text, dar nu e facut pentru a fi citit

Un avantaj al formatului text este ca permite vizualizarea fisierului fara a

folosi programul care l-a produs. Formatul text face debugging-ul mai usor

pentru developeri. Utilizatorii pot citi fisierul daca au nevoie. Un tag uitat sau

un atribut fara ghilimele face un fisier XML inutilizabil. Daca apare o

greseala, aplicatia trebuie sa opreasca citirea si sa raporteze o eroare.

4. XML este 'vorbaret' prin design

Deoarece XML este un format text si foloseste taguri pentru a delimita

datele, fisierele XML sunt aproape intotdeuna mai mari decat formatele

binare. Spatiul pe disk este mai ieftin decat era in trecut. Programe de

compresie ca zip si gzip pot comprima fisierele foarte bine si foarte rapid. In

plus, protocoale de comunicare, ex. http protocolul de baza al web-ului, pot

comprima datele din mers, economisind bandwidth-ul la fel de bine ca

formatul binar.

5. XML este o familie de tehnologii

XML 1.0 este specificatia care defineste ce sunt tagurile si atributele.

"Familia XML" este un set de module (in continua crestere) care ofera

servicii folositoare pentru indeplinirea unor lucruri importante si folosite

deseori.

XLINK descrie un mod standard de a adauga hyperlinkuri unui fisier XML.

XPointer este o sintaxa in dezvoltare, folosita la identificarea unor parti dintr-

un document XML. Un XPointer este asemanator cu un URL, dar in loc sa

indice un document web, indica o parte dint-un fisier XML.

CSS limbajul style sheet, se poate aplica la XML la fel ca la HTML.

XSL este limbjul avansat style sheet. Este bazat pe :

XSLT un limbaj de transformare folosit pentru a rearanja, adauga sau sterge

taguri si atribute.

DOM este un set standard de functii pentru manipularea fisierelor XML (si

HTML) dintr-un limbaj de programare.


XML Schemas 1 si 2 ajuta developerii sa defineasca precis structura

fisierelor XML, in formatul creat de ei. Alte module si utilitati sunt inca in

dezvoltare.

6. XML e nou, dar nu chiar atat de nou

Dezvoltarea XML a inceput in 1996 si XML a devenit o recomandare W3C

din Februarie 1998,

7. XML tranforma HTML in XHTML

Exista o importanta aplicatie XML care are format de document: XHTML.

XHTML are multe din elementele HTML-ului. Sintaxa a fost schimbata un pic

pentru a corespunde regulilor XML. Un format bazat pe XML mosteneste

sintaxa XML si o constrange in mai multe feluri (spre exemplu, XHTML

permite folosirea "<p>", dar nu a "<r>"); totodata, se adauga inteles sintaxei

(XHTML spune ca "<p>" inseamna "paragraph", si nu "pret", "persoana" sau

altceva).

8. XML este modular

XML iti permite sa definesti un nou format de document combinand si

refolosind alte formate. Deoarece cele doua formate pot folosi elemente sau

atribute cu acelasi nume, trebuie sa ai grija la combinarea lor (inseamna

"<p>" "paragraf" dintr-un format, sau "persoana" din celalalt format?). Pentru

a elimina confuzia, XML are un mecanism numit namespce (domenii pentru

nume). XSL si RDFsunt exemple de formate bazate pe XML care folosesc

namespace-uri. XML Schema este conceputa cu acest suport pentru

modularizare. Aceasta modularizare la nivelul definirii unui document XML

face posibila combinarea a doua scheme pentru a forma o a treia, care

defineste un document combinat (combinatie de documente definite de cele

doua scheme initiale).

http://www.w3.org/TR/xmlschema-2/


9. XML este baza RDF-ului si Web-ului Semantic

Resource Description Framework RDF, al W3C, este un format XML text

care suporta descrierea resurselor si aplicatiilor meta-date, cum ar fi playlist-

uri pentru muzica, colectii foto si bibliografii. Spre exemplu, RDF iti poate

permite sa identifici oameni intr-un album foto (pentru web) folosind

informatii dintr-o lista de contacte; apoi clientul tau mail ar putea trimite

automat un mail acestor persoane, anuntandu-i ca fotografiile lor sunt pe

web (on-line). Cum HTML a integrat documente, imagini, sisteme de meniuri

si formulare, RDF este o unealta care permite o integrare mai profunda,

pentru a transforma web-ul un pic mai mult intr-un web semantic. La fel cum

oamenii au nevoie de o conventie care sa stabileasca intelesurile cuvintelor

cu care comunica, si calculatoarele au nevoie de acelasi lucru pentru a

comunica eficient. Descrierile formale dintr-o anumita categorie (cumparare

sau productie, spre exemplu) sunt numite ontologii si sunt o parte necesara

a web-ului semantic. RDF, ontologiile si reprezentarea intelesului pentru a

permite calculatoarelor sa ajute munca oamenilor, sunt parte a activitatii

pentru Web-ul Semantic.

10. XML functioneaza pe orice platforma, este suportat bine si nu are

nevoie de licenta

Alegand XML pentru un proiect, vei putea folosi un numar mare de aplicatii

(este posibil ca una dintre ele sa poata face deja ce ai tu nevoie). Nu trebuie

licenta pentru a folosi XML, nu trebuie sa platesti nimic nimanui.

Comunitatea mare de persoane care folosesc XML inseamna ca nu depinzi

de un sigur producator. Desi XML nu este intotdeauna cea mai buna solutie,

se merita cel putin sa il consideri printre optiuni.


10.3 Cteva reguli de trecere de la HTML la XHTML (eXtensible

HyperText Markup Language)

XHTML este un limbaj utilizat la crearea paginilor Web, asemanator cu HTML-ul si avand la baza tehnologia XML.

In XHTML trebuie respectate o serie de reguli:

La scrierea tag-urilor se folosesc literele mici, XHTML e case-sensitive

Atributele SE PUN INTRE GHILIMELE

Etichetele SE INCHID,

Etichetele goale se inchid astfel: <br /> sau <br></br>. Dintre elementele goale in HTML se pot enumera: <area/>, <base>, <basefont/>, <br/>, <hr/>, <img/>, <link/>, etc.

Elementul deschis primul se inchide ultimul.

elementul deschis al doilea se inchide penultimul,

,,,,,,,,,,,,,,,,,,,,,

Spunem ca elementele se inchid in ordine inversa deschiderii.

Structura unui pagini XHTML

Primele 2 linii contin declartia DOCTYPE si eticheta html:

<!DOCTYPE html PUBLIC ... >

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

………………

</head>

<body>

……………………

</body>

</html>


Declaratia DOCTYPE – este o eticheta HTML, nu trebuie inchisa cu sim-

bolul / .

Eticheta HTML - in XHTML are atributul xmlns (XML NameSpace), cu val-

oarea adresa URL unde sunt prezentate specificatiile W3C.

<html xmlns="http://www.w3.org/1999/xhtml">

Declaratia DOCTYPE si eticheta html specifica tipul documentului, astfel

incat browserul si validatoarele sa-l poata interpreta correct.

BIBIOGRAFIE

200. http://www.siteuri.ro/developer/xml-in-10-points.ro.html

Baze de date. Fundamente teoretice şi practice, Grupul BDASEIG, Editura Infomega, Bucureşti, 2002

Tehnologia aplicaţiilor Web, Floarea năstase, Pavel Năstase, Editura Economică, Bucureşti, 2002

Totul despre HTML 4, Rick Darnel, Editura Teora, Bucureşti, 2002

HTML prin EXEMPLE, Teodoru Gugoiu, Editura Teora, Bucureşti, 2003

HTML Complete, Donna L. Baker, Editura Sybex, 2003

http://inf.ucv.ro/~mihaiug/courses/xml/ValidareaDocumentelorXML.pdf


ANEXA 3

<HTML><! SCOP: calcule interactve ><HEAD><TITLE>Exemplu</TITLE><script language="JavaScript1.2">/* Flying Butterfly script (By [email protected])Modified slightly/ permission granted to Dynamic Drive to feature script in archiveFor full source, visit http://www.dynamicdrive.com */var Ymax=8; //MAX # OF PIXEL STEPS IN THE "X" DIRECTIONvar Xmax=8; //MAX # OF PIXEL STEPS IN THE "Y" DIRECTIONvar Tmax=10000; //MAX # OF MILLISECONDS BETWEEN PARAMETER CHANGES//FLOATING IMAGE URLS FOR EACH IMAGE. ADD OR DELETE ENTRIES. KEEP ELE-MENT NUMERICAL ORDER STARTING WITH "0" !!var floatimages=new Array();floatimages[0]='butterfly2.gif';floatimages[1]='butterfly2.gif';

//*********DO NOT EDIT BELOW***********var NS4 = (navigator.appName.indexOf("Netscape")>=0 && parseFloat(navigator.appVer-sion) >= 4 && parseFloat(navigator.appVersion) < 5)? true : false;var IE4 = (document.all)? true : false;var NS6 = (parseFloat(navigator.appVersion) >= 5 && navigator.appName.indexOf("Net-scape")>=0 )? true: false;var wind_w, wind_h, t='', IDs=new Array();for(i=0; i<floatimages.length; i++){t+=(NS4)?'<layer name="pic'+i+'" visibility="hide" width="10" height="10"><a href="javascript:hidebutterfly()">' : '<div id="pic'+i+'" style="position:absolute; visibility:hid-den;width:10px; height:10px"><a href="javascript:hidebutterfly()">';t+='<img src="'+floatimages[i]+'" name="p'+i+'" border="0">';t+=(NS4)? '</a></layer>':'</a></div>';}document.write(t);function moveimage(num){if(getidleft(num)+IDs[num].W+IDs[num].Xstep >= wind_w+getscrollx())IDs[num].Xdir=false;if(getidleft(num)-IDs[num].Xstep<=getscrollx())IDs[num].Xdir=true;if(getidtop(num)+IDs[num].H+IDs[num].Ystep >= wind_h+getscrolly())IDs[num].Ydir=false;if(getidtop(num)-IDs[num].Ystep<=getscrolly())IDs[num].Ydir=true;moveidby(num, (IDs[num].Xdir)? IDs[num].Xstep : -IDs[num].Xstep , (IDs[num].Ydir)? IDs[num].Ystep: -IDs[num].Ystep);}function getnewprops(num){IDs[num].Ydir=Math.floor(Math.random()*2)>0;IDs[num].Xdir=Math.floor(Math.random()*2)>0;IDs[num].Ystep=Math.ceil(Math.random()*Ymax);IDs[num].Xstep=Math.ceil(Math.random()*Xmax)setTimeout('getnewprops('+num+')', Math.floor(Math.random()*Tmax));}function getscrollx(){if(NS4 || NS6)return window.pageXOffset;if(IE4)return document.body.scrollLeft;}function getscrolly(){if(NS4 || NS6)return window.pageYOffset;

http://www.dynamicdrive.com/


if(IE4)return document.body.scrollTop;}function getid(name){if(NS4)return document.layers[name];if(IE4)return document.all[name];if(NS6)return document.getElementById(name);}function moveidto(num,x,y){if(NS4)IDs[num].moveTo(x,y);if(IE4 || NS6){IDs[num].style.left=x+'px';IDs[num].style.top=y+'px';}}function getidleft(num){if(NS4)return IDs[num].left;if(IE4 || NS6)return parseInt(IDs[num].style.left);}function getidtop(num){if(NS4)return IDs[num].top;if(IE4 || NS6)return parseInt(IDs[num].style.top);}function moveidby(num,dx,dy){if(NS4)IDs[num].moveBy(dx, dy);if(IE4 || NS6){IDs[num].style.left=(getidleft(num)+dx)+'px';IDs[num].style.top=(getidtop(num)+dy)+'px';}}function getwindowwidth(){if(NS4 || NS6)return window.innerWidth;if(IE4)return document.body.clientWidth;}function getwindowheight(){if(NS4 || NS6)return window.innerHeight;if(IE4)return document.body.clientHeight;}function init(){wind_w=getwindowwidth();wind_h=getwindowheight();for(i=0; i<floatimages.length; i++){IDs[i]=getid('pic'+i);if(NS4){IDs[i].W=IDs[i].document.images["p"+i].width;IDs[i].H=IDs[i].document.images["p"+i].height;}if(NS6 || IE4){IDs[i].W=document.images["p"+i].width;IDs[i].H=document.images["p"+i].height;}getnewprops(i);moveidto(i , Math.floor(Math.random()*(wind_w-IDs[i].W)), Math.floor(Math.random()*(wind_h-IDs[i].H)));if(NS4)IDs[i].visibility = "show";if(IE4 || NS6)IDs[i].style.visibility = "visible";startfly=setInterval('moveimage('+i+')',Math.floor(Math.random()*100)+100);}}function hidebutterfly(){for(i=0; i<floatimages.length; i++){if (IE4)eval("document.all.pic"+i+".style.visibility='hidden'")else if (NS6)document.getElementById("pic"+i).style.visibility='hidden'else if (NS4)eval("document.pic"+i+".visibility='hide'")clearInterval(startfly)}}


if (NS4||NS6||IE4){window.onload=init;window.onresize=function(){ wind_w=getwindowwidth(); wind_h=getwindowheight(); }}</script><SCRIPT>//lungimea cercului este calculata cu formula obisnuita 2*Pi*r function calcul(obiect){obiect.LungimeCerc. value=3.14*obiect.razaCerc.value*2 }</SCRIPT><HEAD><BODY><FORM NAME="calculCerc">Precizati raza cercului <INPUT TYPE=text NAME=razaCerc SIZE=25> <P>Lungimea este <INPUT TYPE=text NAME=LungimeCerc SIZE=30> <P><INPUT TYPE=button NAME=buton VALUE="Declansati calculul" ONCLICK="calcul(this.-form)"></FORM></BODY></HTML>

5 XML Si Java Script

Documents

Transcript of 5 XML Si Java Script