Tehnologii Web 2014-2015
106
TEHNOLOGII WEB Acest material este destinat studentilor anului II, invatamant la distantă, specializarea Informatică. Structura cursului: HTML si CSS JAVASCRIPT PHP şi MySQL CONSTRUIREA DOCUMENTELOR XML. Utilizarea servlet-urilor. 2014-2015
description
Tehnologii Web 2014-2015
Transcript of Tehnologii Web 2014-2015
TEHNOLOGII WEB
Acest material este destinat studentilor anului II, invatamant la distantă,
specializarea Informatică.
Structura cursului:
HHTTMMLL ssii CCSSSS
JJAAVVAASSCCRRIIPPTT
PPHHPP şşii MMyySSQQLL
CCOONNSSTTRRUUIIRREEAA DDOOCCUUMMEENNTTEELLOORR XXMMLL..
UUttiilliizzaarreeaa sseerrvvlleett--uurriilloorr..
22001144--22001155
Nota finală care se va acorda fiecărui student, va conţine
următoarele componente în procentele menţionate:
- examen final 60%
- lucrari practice/ proiect 40%
Fiecare student va realiza un site care va cuprinde minim 3
“pagini” pentru fiecare unitate de învăţare (Html, JavaScript,
XML, Php si MySql). Codul sursa al fisierelor va contine si
“comentariile corespunzatoare”. Aplicatia se va transmite cel mai tarziu cu 2 zile inainte de
examen, pe adresa de email [email protected].
UUnniittaatteeaa ddee iinnvvaattaarree II..
CCRREEAARREEAA PPAAGGIINNIILLOORR WWEEBB CCUU HHTTMMLL Aceasta unitate are ca scop cunoasterea si utilizarea tagurilor HTML, care stau la baza crearii
site-urilor WEB. Un site web desemnează o grupă de pagini web multimedia (conţinând texte, imagini
fixe, animaţii ş.a.), accesibile în Internet pe o temă anume şi care sunt conectate între ele prin aşa-numite
hiperlinkuri.
Cuvinte cheie: WWW, FTP , HTTP, IRC, HTML, W3C. Introducere
WWW apare ca o colecţie de informaţii structurate sub formă de documente Web sau pagini Web. Mai multe
pagini Web, organizate ierarhic, formează un site. Site-ul reprezinta un ansamblu de pagini Web, între care sunt
definite legături, astfel încât, pornind de la o primă pagină a cărei adresă reprezintă adresa site-lui, este posibilă
navigarea prin toate paginile acestuia. Site-urile sunt găzduite pe servere speciale numite servere Web. Navigarea
pe Web se face cu ajutorul unor programe numite browsere Web.
După parcurgerea si însusirea acestei teme, studentul va fi capabil:
- sa utilizeze tag-uri de bază,
- sa utilizarea ancorelor, sa insereze imagini, sa creeze tabele,
- sa proiecteze cadre în HTML(frames), sa defineasca formulare, stiluri si
straturi.
Cuprins:
1. Crearea paginilor Web folosind HTML
1.1. Tag-uri de bază
1.2. Utilizarea ancorelor
1.3. Utilizarea imaginilor
1.4. Crearea tabelelor
1.5. Cadre în HTML(frames)
1.6. Definirea formularelor
1.7. Stiluri
1.8. Straturi
Intrebari de control; Tema de casa; Exemple rezolvate; Formular feed-
back;
Internetul, ca şi serviciul WWW, lucrează în tehnologia client/server, astfel:
browserul stabileşte o conexiune TCP/IP către server;
browserul emite o cerere HTTP către server;
serverul Web recepţionează cererea, o interpretează şi emite un răspuns către browser prin
trimiterea documentului codului HTML;
browserul interpretează codul HTML şi afişează pagina web pe ecran;
Serve-rul de Web primeşte cererea, o interpretează şi emite un răspuns către client. În forma cea mai simplă,
răspunsul este un document HTML (un hipertext), caz în care browser-ul afişează pagina Web corespunzătoare.
TCP/IP (Transfer Control Protocol / Internet Protocol) este protocolul prin care se face transmisia datelor în
Internet. Principalele caracteristici ale acestui protocol sunt:
independenţă faţă de tipul calculatorului sau de sistemul de operare folosit;
independenţă faţă de tipul reţelei, ceea ce permite interconectarea unor reţele diferite.
HTTP (HyperText Transfer Protocol) este protocolul folosit pentru transferul informaţiilor din cadrul paginilor
Web şi anume, a HyperTextului. O cerere HTTP conţine un URL dar şi alte informaţii. Paginile Web sunt de fapt
documente, fişiere, cu un format special ce au exitensia HTML.
HTML (HyperText Markup Language) este văzut ca un limbaj de realizare a hypertextului.
Localizarea unei resurse în Internet se face prin specificarea adresei acesteia, adresă ce poartă numele de URL
(Uniform Resource Locator) şi are formatul
protocol://server.domeniu/cale/fişier.extensie.
Un URL conţine următoarele informaţii:
- protocolul folosit;
- adresa maşinii pe care se află resursa;
- portul ales pentru conexiune;
- calea către resursă;
- numele resursei.
Exemplu: http://www.microsoft.com/download/index.html
Accesarea unui site se face, de obicei, numai prin specificarea în cadrul browse-rului a unei adrese de
forma:www.utm.ro. În mod automat, browserul va introduce şi protocolul http.
Cu ani în urmă, oamenii de ştiinţă s-au gândit, că ar fi bine, ca cele mai importante reţele de calculatoare să fie
conectate între ele. Rezultatul a fost apariţia ‘‘mamei tuturor reţelelor”, numită acum Internet. Până în anul 1990,
accesarea informaţiilor de pe Internet era foarte dificilă şi reţeaua nu era folosită decât de un grup restrâns de
oameni de ştiinţă. Fizicianul Tim Berners-Lee a devenit celebru, datorită faptului că a ‘‘inventat” link-urile
(legături, referinţe) hypertext. Deşi această idee nu era nouă, ea a condus la dezvoltarea unui limbaj simplu, care s-a
impus, până la urmă, ca şi un standard. Tim Berners-Lee a numit acest limbaj Hypertext Markup Language,
cunoscut sub denumirea prescurtată de HTML. Noţiunea de hypertext înseamnă text păstrat în format electronic cu
link-uri între pagini. În anul 1993, în jur de 100 de calculatoare din lumea întreagă erau echipate pentru a găzdui
pagini HTML. Aceste pagini interconectate au fost ‘‘nimite” World Wide Web. După un timp, au început să fie
scrise primele browsere Web cu ajutorul cărora se puteau vizualiza pagini Web care conţin atât text, cât şi imagini.
Unul din primele elemente fundamentale ale WWW (World Wide Web) este HTML (Hypertext Markup
Language), care descrie formatul primar în care documentele sunt distribuite şi văzute pe Web. Multe din
trăsăturile lui, cum ar fi independenţa faţă de platformă, structurarea formatării şi legaturile hypertext, fac din el un
foarte bun format pentru documentele Internet şi Web.
Documentele HTML sunt documente în format ASCII şi prin urmare, pot fi create cu orice editor de texte. Au fost
însă dezvoltate editoare specializate care permit editarea într-un fel de WYSIWYG, deşi nu se poate vorbi de
WYSIWYG, atâta vreme cât navigatoarele afişează acelaşi document oarecum diferit, în funcţie de platforma pe
care rulează.
W3C prezinta un set de tehnologii integrate. Se pot crea situri multimedia cu tehnologia W3C existentă XHTML
(Structured XML markup), CSS (Style sheets), SVG (2D vector animated graphics), SMIL (Synchronized
Multimedia) etc. Aceste tehnologii au fost construite, prin consens, de către cele mai importante organizatii care
activeaza pe web.Paginile Web sunt conţinute în fisiere pe un calculator server. Un astfel de server este, de
exemplu, www.yahoo.com, sau www.google.ro. Calculatoarele care accesează paginile Web sunt clienţi. De fapt,
pe clienţi rulează programe dedicate vizualizarii paginilor Web, numite browsere Web şi acestia accesează şi
afişează pagina Web pe calculatorul local.
‘‘WWW Consortium” perfecţionează standarde noi, oferă programe pentru servere şi clienţi, documentaţie etc.
Producători de browsere implementează în browserele lor standardele W3C, dar dezvoltă şi ei standarde pe care
numai browserele lor le suportă. Din aceste motiv, o pagină web trebuie să fie testă cu mai mult browsere.
Internetul pune la dispoziţia utilizatorilor mai multe servicii, printre care:
E-mail care permite schimbul de mesaje între utilizatori
WWW (World Wide Web) care este cel mai important serviciu Internet prin care utilizatorul are acces
rapid la informaţia organizată, sub forma unor documente numite pagini web.
FTP (File Transfer Protocol) este un serviciu specializat pe transferul de fişiere.
Telnet (Remote Access) permite exploatarea la distanţă a resurselor unui calculator.
News oferă utilizatorului accesul la diverse informaţii din domenii bine precizate.
IRC (Internet Relay Chat) permite realizarea unei comunicări în timp real, în general, sub formă de text.
11 CCrreeaarreeaa ppaaggiinniilloorr wweebb ffoolloossiinndd HHTTMMLL
Un fişier HTML (”HyperText Markup Language”) este un fişier text, care reprezintă sursa paginii de Web. Fişierul
HTML trebuie să aibă extensia .htm sau .html, iar browserul îl interpreteaza. Deoarece fişierul este de tip text, el
poate fi editat cu Notepad (din Windows) sau editoare specilizate.
HTML-ul nu reprezintă un limbaj de programare ci mai degrabă un “limbaj de marcare a textului”. El conţine un
set de coduri speciale, care se inserează într-un text, pentru a adăuga informaţii despre formatarea textului şi despre
legăturile existente în pagini. Această marcare a textului se face cu ajutorul unor tag-uri (marcaje, etichete). Un tag
este introdus întotdeauna între paranteze unghiulare, sub forma:
<nume_tag atribut1=‘‘valoare1” atribut2=‘‘valoare2” … >
Marcajele html pot avea sau nu şi o formă de închidere:
</nume_tag>
Marcajele html se aplică unui text sau chiar altor marcaje prin cuprinderea lor între forma de deschidere şi forma de
închidere.
Spre exemplu, marcajul <html> indică browser-ului că documentul este scris şi formatat pentru limbajul HTML.
Forma de închidere este </html>. De reţinut, faptul că browser-ele Web ignoră formatările aplicate textului cu
ajutorul procesoarelor de texte valabile fiind doar formatările aplicate cu ajutorul tag-urilor html.
Un fişier html, este de obicei, împărţit, din motive de organizare, în două secţiuni:
antetul (header-ul) care conţine informaţii introductive de formatare a documentului. Este identificat
de forma de deschidere şi forma de închidere a marcajului <head>… </head>. Informaţiile cuprinse
de acest marcaj nu apar în pagina Web.
corpul efectiv al documentului, adică ceea ce este vizualizat în fereastra browser-ului, este cuprins
între marcajele <body> şi </body>.
Observaţie: O etichetă (un tag) poate fi scris/ă atât cu litere mari, cât şi cu litere mici. Standardul W3C recomandă
folosirea literelor mici pentru tag-uri. Mai mult, generaţia urmatoare de standard HTML, standardul XHTML
impune obligatoriu utilizarea tag-urilor cu litere mici.
Article I. Validarea documentelor HTML
Toate documentele trebuie validate pentru elimiarea erorilor, ca de exemplu lipsa unei ghilimele,
neinchiderea unei paranteze, elemente sau atribute scrise gresit sau structurate invalid. Erorile nu sunt
vizibile mereu in browser deoarece fiecare le recupereaza in modul propriu. Validarea acestor documente
se face cu un serviciu special W3C care poate fi accesat de oricine la adresa: http://validator.w3.org. Un
validator verifica definitia tipului documentului(DTD) si nu siguranta legaturilor din document.
Elementul DOCTYPE
Documentul HTML validat trebuie declarat in functie de versiunea pe care o utilizeaza.
Declararea tipului este definita de DTD(Document Type Definition), in HTML 4 pot exista 3 DTD
specifici, astfel autorul trebuie sa include in pagina sa tipul de document in functie de versiune. Elementele care se pot utiliza în cadrul paginilor depind de versiunea HTML utilizată.În tabelul 1 avem lista cu
versiunile HTML şi modul de declarare al acestora la începul oricărui fişier html (DOCTYPE):
Tabelul 1. Declaraţii DOCTYPE
Versiune
HTML declaraţia DOCTYPE
HTML 4.01
<!DOCTYPE HTML PUBLIC ‘‘-//W3C//DTD HTML 4.01//EN”
‘‘http://www.w3.org/TR/html4/strict.dtd”>
<!DOCTYPE HTML PUBLIC ‘‘-//W3C//DTD HTML 4.01 Transitional//EN”
‘‘http://www.w3.org/TR/html4/loose.dtd”>
<!DOCTYPE HTML PUBLIC ‘‘-//W3C//DTD HTML 4.01 Frameset//EN”
‘‘http://www.w3.org/TR/html4/frameset.dtd”>
HTML 3.2 <!DOCTYPE HTML PUBLIC ‘‘-//W3C//DTD HTML 3.2 Final//EN”>
HTML 1.0 <!DOCTYPE html PUBLIC ‘‘-//IETF//DTD HTML 1.0//EN”>
XHTML 1.0
<!DOCTYPE html PUBLIC ‘‘-//W3C//DTD XHTML 1.0 Strict//EN”
‘‘http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<!DOCTYPE html PUBLIC ‘‘-//W3C//DTD XHTML 1.0 Transitional//EN”
‘‘http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<!DOCTYPE html PUBLIC ‘‘-//W3C//DTD XHTML 1.0 Frameset//EN”
‘‘http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd”>
XHTML 1.1 <!DOCTYPE html PUBLIC ‘‘-//W3C//DTD XHTML 1.1//EN”
‘‘http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd”>
Atenţie! Nu se poate valida un document, dacă nu se utilizează una din declaraţiile din tabelul 1, la începutul
acestuia. De asemenea, anumite motoare de indexare caută elemente META în paginile HTML, elemente care au
rolul de a defini o listă de cuvinte cheie, separate cu virgulă. Motoarele de cautare pot prezenţa aceste cuvinte
cheie, ca rezultat al unei cautari.
Etichetele META au atributele NAME şi CONTENT şi se folosesc conform sintaxei:
<META NAME= “meta nume” CONTENT= “conţinut”>
Exemplu de utilizarea a acestei etichete în antetul unei paginii
<meta name=‘‘informatica” content=‘‘importanta informaticii in procesul de invatamant”>
Etichete meta se poate utiliza şi pentru a înlocui comenzile ‘‘Refresh” sau ‘‘Reload” care au rolul de a
reînmprospăta conţinutul paginii încărcate în browser.
Exemplu: pentru reîmprospătarea la 10 secunde a unui pagini încaărcate într-un browser:
<meta http-equiv=‘‘refresh” content=‘‘10;url=http://www.test_site.ro”>
Inserarea unui titlu pentru pagina web
Un lucru subtil, dar simplu, pe care îl putem face este să inserăm un titlu pentru o pagină Web, titlu ce va fi afişat în
bara de titlu a browser-ului folosit. Acest titlu se poate introduce cu ajutorul marcajului <title> … </title>. Acestea
vor fi introduse în interiorul marcajelor
Article II. HTML 5
HTML 5.0 – Acest limbaj se bazeaza pe prezentarea continutului si structurarea in world wide
web , o tehnologie nucleu pentru Internet propusa si initial pentru Opera.
Este a cincea revizuire a standardului HTML si din octombrie 2011 este in curs de dezvoltare.
Acest limbaj se bazeaza pe prezentarea continutului si structurarea in world wide web.
Obiectivele sale principale au fost acelea de a imbunatati limbajul cu un suport pentru cele mai recente
aparitii multimedia. HTML 5 isi propune sa cuprinda nu numai HTML 4.0 dar si XHTML 1.
HTML 5 devine o incercare de a define un singur limbaj de marcare care poate fi scris in oricare
dintre sintaxele HTML sau XHTML.
Acesta include modele detaliate de prelucrare pentru a incuraja mai multe implementari
interoperabile, extinde, imbunatateste si rationalizeaza disponibilitatile pentru documentele web si
introduce marcarea si aplicatii API(application programming interfaces) pentru aplicatii web complexe.
HTML 5 este un posibil candidat pentru aplicatiile de platforme mobie, multe caracteristici au fost
create din considerarea ca va trebui sa devina capabil sa ruleze pe dispositive cum ar fi o tableta sau un
smart-phone.
Aduce multe noi caracteristici sintactice, acesta cuprinzand elemente ca <video>, <audio>,
precum si integrarea continutului SVG(Scalable Vector Graphics) care inlocuieste utilizarea tag-ului
<object> .
Aceste noutati sunt proiectate pentru a facilita includerea si manipularea in web a continuturilor
multimedia si grafice fara a fi nevoie sa se recurga la proprietatile de plugin si API.
XHTML5
XHTML5 este serializarea XML a HTML5, documentele XML trebuie servite cu un tip XML
media de internet. HTML 5 necesita utilizarea stricata a XML, sintaxa bine formata.
Alegerea intre HTML5 si XHTML5 se rezuma la alegerea tipului de continut MIME: tipul de
media ales determina ce tip de document se va folosi. In XHTML5 html exista si poate fi chiar omis.
Lista elementelor noi in HTML 5.0:
Tag-ul Descrierea
<article> marcheaza un articol
<aside> marcheaza un continut aparte fata de continutul paginii, dar care are legatura cu el.
<audio> marcheaza introducerea de continut audio
<canvas> marcheaza introducerea de continut grafic
<command> marcheaza un buton de comanda
<datalist> marcheaza un meniu drop-down
<details> marcheaza detaliile unui element
<dialog> marcheaza un dialog, o conversatie
<embed> marcheaza continut interactiv extern sau introducerea unui plugin
<figure> marcheaza un grup de elemente care au legatura unul cu celalalt si care pot fi considerate in
pagina, continut de sine statator.
<footer> marcheaza sectiunea footer a pagini
<header> marcheaza sectiunea header a pagini
<hgroup> marcheaza o sectiune a pagini
<keygen> marcheaza un cod generat automat intr-un formular
<mark> marcheaza text evidentiat
<meter> marcheaza valoarea unei unitati de masura cunoscute
<nav> marcheaza o bara de navigare cu linkuri
<output> marcheaza diferite tipuri de rezultate ale unui script oarecare.
<progress> marcheaza o bara de progres fie ea grafica sau numerica
<rp> defineste continut care va fi afisat in cazul in care browser-ul nu supotra tag-ul ruby
<rt> defineste o regula sau o explicatie pentru tagul ruby
<ruby> folosit impreuna cu caracterele asiatice
<section> marcheaza o sectiune oarecare (header, footer, bara de navigare, capitole sau orice alta
sectiune)
<source> marcheaza sursa fisierului multimedia
<time> marcheaza ora / data
<video> marcheaza introducerea unui video
Atribute noi pentru Tag-ul input:
Tag-ul Descrierea
tel Valoare de tip numar de telefon
search Valoare de tip camp de cautare
url Valoare de tip URL. (link)
email Valoare de tip adresa de email.
datetime Valoarea este de tip data sau timp
date Valoarea este de tip data
month Valoarea reprezinta una din lunile anului
week Valoarea reprezinta una din saptamanile zilelor.
time Valoarea este de tip timp
datetime-local Valorea este de tip date/time local
number Valoarea este un numar
range Valoarea este un numar dintr-un interval dat
color Valoarea este o culoare in hexazecimal. Ex: #FF8800
placeholder Specifica un indiciu care descrie valoarea preconizata a unui camp.
Article III. 1.1 Tag-uri de bază
Sfârşitul de linie
După cum se observă, caracterele “enter” , “tab” şi spaţiile multiple sunt ignorate de către browser. Trecerea pe o
linie nouă se face prin inserarea marcajului <br> (“line break”). Nu are formă de închidere. Introducerea unui
spaţiu se poate face prin construcţia: .
Tabelul 2 prezintă corespondenţa dintre caracterele speciale şi codul acestora.
a)
b) Tabelul 2 – Entitaţile caracter cele utilizate
i) caracter descriere 2) secvenţă
cod cod zecimal
Spatiu nedivizibil  
< Mai mic decât < <
> Mai mare decât > >
& Ampersand & &
‘‘ Ghilimele " "
’ Apostrof '
§ Sectiune § §
© Copyright © ©
® Marca înregistrata ® ®
× Multiplicare × ×
÷ Împartire ÷ ÷
€ Euro € €
Culoarea de fond şi culoarea textului
O culoare se compune din diferite procentaje ale culorilor de baza rosu, verde şi albastru (RGB – ”Red”, ‘‘Green”,
‘‘Blue”) şi poate fi precizată în trei moduri:
1. folosind numele culorii (”red”, de exemplu, adică roşu); sunt disponibile cel puţin 16 nume de culori: aqua,
black, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, teal, white şi yellow.
2. cu combinaţia valorii zecimale a celor trei culori de baza, fiecare luând o valoare întreaga de la zero la 255,
de exemplu ‘‘rgb(255,0,0)”, care este tot roşu (verdele şi albastrul sunt zero); observaţi sintaxa
(”rgb(codrosu,codverde,codalbastru)”);
3. cu combinatia valorii hexazecimale a celor trei culori de baza, fiecare luând o valoare de la zero la FFhexa,
de exemplu ‘‘#FF0000” este tot roşu, deoarece ‘‘FF” (pentru roşu) hexazecimal este 255 zecimal, iar ‘‘00”
este zero şi în zecimal;
Culorile specificate în hexazecimal sunt recunoscute de toate browserele.
Tabelul 3. Utilizarea codurilor hexa
DENUMIRE
CULOARE
COD HEXA
aqua #00FFFF
black #000000
blue #0000FF
fuchsia #FF00FF
gray #808080
green #008000
lime #00FF00
maroon #800000
navy #000080
olive #808000
purple #800080
red #FF0000
silver #C0C0C0
teal #008080
white #FFFFFF
yellow #FFFF00
Section 3.02 Utilizarea culorilor pentru tagul <body>
În tag-ul <body>, puteti specifica culoarea fundalului, sau a textului, a legaturilor nevizitate, a celor vizitate sau a
celor activate.
atribut efect
bgcolor fundal
text text
link legatură nevizitată
vlink legatură vizitată
alink legatură activă
Stiluri pentru blocurile de text. Unui text i se pot aplica diverse stiluri prin folosirea marcajelor:
NUME TAG EFECT
<b>…<b> text îngrosat
<big>…</big> text cu caractere mari
<em>…</em> text evidentiat
<i>…</i> text ‘‘italic”
<small>…</small> text cu caractere mici
<strong> …</strong> text mai evidentiat decât <em>
<sub>…</sub> indice inferior (”subscript”)
<sup>…</sup> indice superior (”superscript”)
<s>….</s> text taiat
<del>…</del> text ‘‘sters”
<u>…</u> text subliniat
Blocuri paragraf
Cu ajutorul etichetei paragraf <p> este posibil trecerea la o linie noua şi permite:
- inserarea unui spaţiu suplimentar înainte de blocul paragraf;
- inserarea unui spaţiu suplimentar după blocul paragraf, daca se foloseşte delimitatorul </p> (acesta fiind
opţional);
- alinierea textului cu ajutorul atributului align, având valorile posibile ‘‘ left ‘‘, ‘‘center ‘‘ , ‘‘ right ‘‘şi
‘‘justify”.
Blocuri de titlu
Într-un text titlurile (headers) de capitole pot fi introduse cu ajutorul etichetelor <h1>, <h2>, <h3>, <h4>, <h5>,
<h6>. Toate aceste etichete se refera la un bloc de text şi trebuie însoţite de o eticheta de încheiere similara.
Aceste etichete accepta atributul align pentru alinierea titlului blocului de text la stanga (în mod prestabilit ) , în
centru şi la dreapta. Tag-ul <h1> permite scrierea unui titlu cu caractere mai mari şi aldine, pe când <h6> foloseşte
caracterele cele mai mici.
Linii orizontale
Într-o pagina Web pot fi inserate linii orizontale. Acest lucru se face cu ajutorul etichetei <hr>. Pentru a configura
o linie orizontala se utilizează următoarele atribute ale etichetei <hr> care sunt:
align permite alinierea liniei orizontala. Valorile posibile sunt ‘‘ left ‘‘ ,”center” şi ‘‘right”;
width permite alegerea lungimii liniei;
size permite alegerea grosimii liniei;
noshade când este prezent defineşte o linie fără umbra;
color permite definirea culorii liniei.
Blocuri <center>
Blocul introdus de etichetele <center>...</center> aliniază centrat toate elementele pe care le conţine.
Fonturi Un font este caracterizat de următoarele atribute:
culoare (stabilită prin atributul color);
nume (stabilit prin atributul face);
mărime (definită prin atributul size);
Toate aceste atribute aparţin etichetei <font>, care permite inserarea de blocuri de texte personalizate.
Familia fontului
Pentru a scrie un text într-o pagina, pot fi folosite mai multe fonturi (stiluri de caractere). Exista cinci familii
generice de fonturi care sunt de regulă disponibile pe toate calculatoarele utilizatorilor: serif, sans serif, cursive,
monospace şi fantasy. Tipul de font necesar poate fi stabilit prin atributul face al etichetei font.
Pot fi introduse mai multe fonturi separate prin virgula. În acest caz, browserul va utiliza primul font din listă
instalat pe calculatorul client.
Mărimea fontului
Pentru a stabili mărimea unui font se utilizează atributul size al etichetei . Valorile acestui atribut pot fi:
1, 2, 3, 4, 5, 6, 7 ( 1 pentru cel mai mic font şi 7 pentru cel mai mare);
+1, +2, etc. pentru a mari dimensiunea fontului cu 1, 2, etc. fata de valoarea curenta;
-1, -2, etc. pentru a micşora dimensiunea fontului cu 1, 2, etc. fata de valoarea curenta.
Utilizarea listelor
În HTML există trei tipuri de liste care sunt:
1. liste de definiţie
2. liste neordonate
3. liste ordonate
Unul din cele mai obişnuite elemente din documentele cu mai multe pagini este un set de definiţii, referinţe sau
indexuri. Glosarele sunt exemple clasice în acest sens; cuvintele sunt listate în ordine alfabetica, urmate de definiţii
ale termenilor respectivi. În HTML, întreaga secţiune a unui glosar va fi gestionata prîntr-o lista de definiţii, care
este inclusa într-o pereche de marcaje de lista de definiţii: <dl>...</dl> (de la ‘‘definition list” = lista de definiţii)
Observaţii:
- Un termen al listei este iniţiat de eticheta <dt> (de la ‘‘definition term” = termen definit);
- Definiţia unui termen este iniţiata de eticheta <dd> (de la ‘‘definition description” = descrierea definiţiei);
- Definiţia unui termen începe pe o linie noua şi este indentată;
O lista neordonată este un bloc de text delimitat de etichetele corespondente <ul>...</ul> (” ul ‘‘ vine de la ‘‘
unordered list ‘‘ = lista neordonată). Fiecare element al listei este iniţiat de eticheta <li> (list item). Lista va fi
indentată fata de restul paginii Web şi fiecare element al listei începe pe un rând noua.
Tag-urile <ul> şi <li> pot avea un atribut type care stabileşte caracterul afişat în faţa fiecărui element al listei.
Valorile posibile al acestui atribut sunt:
o ‘‘circle” (cerc)
‘‘disc” (disc plin) (valoarea prestabilita);
‘‘square” (patrat)
O lista ordonată de elemente este un bloc de text delimitat de etichetele corespondente <ol>...</ol> (”ol” vine de
la ‘‘ordered list” = lista ordonata). Fiecare element al listei este introdus de eticheta <li> (list item).
Lista va fi indentată faţă de restul paginii Web şi fiecare element al listei începe pe un rând nou.
Tag-urile <ol> şi <li> pot avea un atribut type care stabileşte tipul de caractere utilizate pentru ordonarea listei.
Valorile posibile sunt:
- ‘‘ A ‘‘ pentru ordonare de tipul A , B , C , D etc.;
- ‘‘ a ‘‘ pentru ordonare de tipul a , b , c , d etc.;
- ‘‘ I ‘‘ pentru ordonare de tipul I , II , III , IV etc.;
- ‘‘ i ‘‘ pentru ordonare de tipul i , ii , iii , iv etc.;
- ‘‘ 1 ‘‘ pentru ordonare de tipul 1 , 2 , 3 , 4 etc
Tag-ul <ol> poate avea un atribut start care stabileşte valoarea iniţiala a secvenţei de ordonare. Valoarea acestui
atribut trebuie să fie un număr întreg pozitiv.
Definirea legături
Legaturile (link-urile) reprezintă partea cea mai importantă a unei pagini Web.Ele transformă un text obişnuit în
hipertext sau hiperlegatura, care permite trecerea rapidă de la o informaţie aflata pe un anumit server la altă
informaţie memorată pe un alt server, aflat oriunde în lume. Legăturile sunt zone active într-o pagină Web, adică
zone de pe ecran sensibile la apăsarea butonului stâng al mouse-ului.
O legatura către o pagina aflata în acelaşi director
O legătură către o pagina aflata în acelaşi director se formează cu ajutorul etichetei <a> (de la ‘‘anchor”=ancora).
Pentru a preciza pagina, indicată de legătură, se utilizează un atribut al etichetei <a> numit href, care ia valoare
numele fişierului HTML aflat în acelaşi director. Zona activă, care devine sensibilă la apăsarea butonului stâng al
mouse-ului, este formata din textul cuprins între etichetele <a>...</a>.
Prezenţa etichetei de sfârşit </a> este obligatorie.
O legătură către un site particular
În exemplul următor se utilizează adresa URL www.utm.ro care încarcă pagina de start din site-ul Universităţii..
<html>
<head>
<title> Link către site-ul UTM</title>
</head>
<body>
<h3>Link către site-ul UTM </h3>
<a href=‘‘http://www.opera.com”>Opera 9.6 Web browser</a>
</body>
</html>
1.2 Utlizarea ancorei
Într-o pagină foarte lungă pot exista puncte de reper către care se definesc legături. O ancora se defineşte, de
asemenea, prin eticheta <a>. Pentru a defini ancora, se utilizează atributul name care primeşte ca valoare un nume
atribuit ancorei (de exemplu ‘‘leg1”).
Pentru a insera o legătură către ‘‘leg1”, definită în aceeaşi pagina, se utilizează eticheta <a> având atributul href de
valoare ‘‘#leg1”.
Pentru a introduce o legătură către o ancoră definită în alt document (altă pagină), aflat în acelaşi director, atributul
href primeşte o valoare de forma ‘‘nume_fisier.html#nume_ancora”.
Alegerea culorilor pentru legaturi
În mod prestabilit, se utilizează trei culori pentru legaturi:
culoare pentru legaturile nevizitate (nu s-a efectuat nici un clic pe ele)
culoare pentru legaturile vizitate (s-a efectuat cel puţin un clic pe ele)
culoare pentru legaturile active (când se execută clic şi se ţine apăsat).
Aceste atribute pot fi stabilite cu ajutorul următoarelor atribute ale etichetei <body>:
link pentru legaturile nevizitate;
vlink pentru legaturile vizitate;
alink pentru legaturile active.
Valorile pe care le pot lua aceste atribute sunt culori definite prin nume sau conform standardului RGB.
Utilizarea poştei electronice - se utilizează în construcţia adresei URL cuvântul mailto: urmat de o adresa e-mail
valida.
Pentru ca exemplul următor să funcţioneze trebuie ca pe calculator să fie instalat o aplicaţie de expediere a
mesajelor electronice (Outlook Express, Microsoft Outlook etc). Adresa trebuie să fie validă şi calculatorul să fie
conectat la Internet.
Atributul target
Dacă dorim ca pagina solicitată să fie încărcată într-o altă fereastră decât cea curentă, atunci trebuie lansată în
execuţie o nouă instanţă a browserului care va conţine noua pagină. Acest lucru se realizează folosind atributul
target al etichetei <a>, care primeşte ca valoare un nume. Numele ferestrei poate fi folosit ca valoare pentru
atributul target şi pentru alte legături caz în care paginile respective vor fi încărcate în aceeaşi fereastră. Atributul
target acceptă şi alte valori cum ar fi _blank caz în care pagina se va încărca într-o fereastră nouă, anonimă (nu
poate fi folosită pentru încărcarea altor pagini).
1.3 Utilizarea imaginilor
Imaginile sunt stocate în fisiere cu diverse formate. Formatele acceptate de browsere pentru fişierele imagine sunt:
GIF (Graphics Interchange Format) cu extensia .gif;
JPEG (Joint Photographic Experts Group) cu extensia .jpeg sau .jpg;
XPM (X PixMap) cu extensia .xmp;
XBM (X BitMap) cu extensia .xbm;
BMP (BitMap) cu extensia .bmp (numai cu Internet Explorer);
TIFF (Tagged Image File Format) cu extensia .tif sau .tiff;
Cele mai răspândite formate sunt GIF (8 biţi pentru o culoare, 256 culori posibile) şi JPEG (24 biţi pentru o
culoare, 16777216 de culori posibile). Toate imaginile cu care vom lucra vor avea adresa URL exprimata în funcţie
de directorul ce conţine documentul HTML care face referire la imagine. Pentru a insera o imagine într-o pagina, se
utilizează eticheta <img> (de la ‘‘image”=imagine). Pentru a putea fi identifica imaginea care va fi inserată, se
utilizează un atribut al etichetei <img> şi anume src (de la ‘‘source”=sursa). Daca imaginea se afla în acelaşi
director cu fisierul HTML care face referire la imagine, atunci adresa URL a imaginii este formata numai din
numele imaginii, inclusiv extensia.
< img src=‘‘imagine.gif”>
Atributul alt permite afişarea unui text alternativ în locul imaginii dacă aceasta nu este încărcată sau lângă mouse
atunci când acesta este plasat peste imagine.
Alinierea unei imagini
Alinierea unei imagini se poate face prin intermediul atributului align care poate lua următoarele valori:
‘‘left” - aliniere la stânga; celelalte componente sunt dispuse pe în partea dreapta;
‘‘right” - aliniere la dreapta; celelalte componente sunt dispuse pe în partea stânga;
‘‘top” - aliniere deasupra; partea de sus a imaginii se aliniază cu partea de sus a textului ce precede
imaginea;
‘‘middle” - aliniere la mijloc; mijlocul imaginii se aliniază cu linia de bază a textului ce precede imaginea.
‘‘bottom” - aliniere la baza; partea de jos a imaginii se aliniază cu linia de bază a textului.
Alinierea textului în jurul imaginii
Atributele hspace şi vspace precizează distanta în pixeli pe orizontală, respectiv pe verticală, dintre imagine şi
restul elementelor din pagina.
Imagini pentru fundalul unei pagini
O imagine poate fi utilizata pentru a stabili fondul unei pagini Web. În acest scop, se foloseşte atributul
background al etichetei <body>, având ca valoare adresa URL a imaginii. Imaginea se multiplica pe orizontala şi
pe verticala, până umple întregul ecran.
Atributul bgproperties=fixed menţine imaginea fixă la realizarea unei defilări în pagină.
Imagini folosite ca legături
Pentru a utiliza imaginea ‘‘strart.jpg” drept legatura către pagina test_1.1.html utilizam sintaxa:
<a href =‘‘test_1.1.html”><img src= ‘‘start.jpg”></a>
În mod prestabilit, imaginea utilizată pe post de zonă activă este înconjurată de un chenar având culoarea unei
legaturi. Daca stabilim pentru atributul border al etichetei <img> valoare ‘‘0” acest chenar dispare.
1.4 Crearea tabelelor
Tabelele ne permit să creăm o reţea dreptunghiulară de domenii, fiecare domeniu având propriile opţiuni pentru
culoarea fondului, culoarea textului, alinierea textului etc.
Pentru a insera un tabel se folosesc etichetele corespondente
<table> … </table>
Un tabel este format din rânduri. Pentru a insera un rând într-un tabel se folosesc etichetele <tr> …(”table row”=
rând de tabel) th …(”table head”= rând de tabel bold). Folosirea etichetei de sfârşit este opţională. Un rând este
format din mai multe celule ce conţin date. O celulă de date se introduce cu eticheta <td> .
În mod prestabilit, un tabel nu are chenar. Pentru a adăuga un chenar unui tabel, se utilizează atributul border.
Acest atribut poate primi ca valoare orice număr întreg (inclusiv 0) şi reprezintă grosimea în pixeli a chenarului
tabelului. Dacă atributul border nu este urmata de o valoare atunci tabelul va avea o grosime prestabilita egală cu
1 pixel, o valoare egală cu 0 semnifică absenţa chenarului. Când atributul border are o valoare nenulă, chenarul
unui tabel are un aspect tridimensional.
Alinierea tabelului
Pentru a alinia un tabel într-o pagina Web, se utilizează atributul align al
etichetei table cu următoarele valori posibile: ‘‘left” (valoarea
prestabilita), ‘‘center”, ‘‘right”.
Definirea culorilor de fond pentru un tabel
Culoarea de fond se stabileşte cu ajutorul atributului bgcolor, care poate fi
ataşat întregului tabel prin eticheta table, unei linii prin eticheta tr sau
celule de date prin eticheta td. Valorile pe care le poate primi bgcolor sunt
cele cunoscute pentru o culoare. Dacă în tabel sunt definite mai multe
atribute bgcolor, atunci prioritatea este următoarea: celulă, linie, tabel.
<html>
<head><title>culoare tabel</title></head>
<body><h1 align=center>Un tabel simplu colorat</h1><hr>
<table border=‘‘3” bgcolor=‘‘green”>
<tr> <td>verde 11 <td bgcolor=‘‘red”>rosu 11
<tr bgcolor=‘‘blue”> <td>albastru 21 <td bgcolor=‘‘yellow”>galben 22
<tr bgcolor=‘‘cyan”> <td>cell 31 <td>cell 32
<tr> <td>cell 41 <td bgcolor=‘‘white”>cell 42
</table>
</body>
</html>
Utilizarea culorilor în tabele
Dimensionarea celulei unui tabel
Distanţa dintre două celule vecine se defineşte cu ajutorul atributului
cellspacing al etichetei table. Valorile acestui atribut pot fi numere
întregi pozitive, inclusiv 0, şi reprezintă distanţa în pixeli dintre două
celule vecine. Valoarea prestabilita a atributului cellspacing este 1.
Distanţa dintre marginea unei celule şi conţinutul ei poate fi definită cu
ajutorul atributului cellpadding al etichetei table. Valorile acestui atribut
pot fi numere întregi pozitive. Valoarea prestabilita a atributului
cellpadding este 1.
Dimensionarea unui tabel
Dimensiunile unui tabel - lăţimea şi înălţimea - pot fi stabilite exact prin
intermediul a două atribute, width şi height, ale etichetei table.
Valorile acestor atribute pot fi:
numere întregi pozitive reprezentând lăţimea respectiv înălţimea în
pixeli a tabelului;
numere întregi între 1 şi 100, urmate de semnul %, reprezentând
fracţiunea din lăţimea şi înălţimea totală a paginii.
- În exemplul următor, se utilizează un truc care permite afişarea într-o
pagina Web a unui text poziţionat în centrul paginii.
Alinierea conţinutului unei celule
Alinierea pe orizontala a conţinutului unei celule se face cu ajutorul
atributului align care poate lua valorile: ‘‘left” (la stânga),”center”
(centrat , valoarea prestabilita ), ‘‘right” (la dreapta). Alinierea pe
verticala a conţinutului unei celule se face cu ajutorul atributului valign
care poate lua valorile: ‘‘bottom” (jos), ‘‘middle” (la mijloc, valoarea
prestabilita), ‘‘top” (sus). Aceste atribute pot fi ataşate atât etichetei tr
pentru a defini tuturor elementelor celulelor unui rând, cât şi etichetelor
td pentru a stabili alinierea textului într-o singură celulă .
Dimensionarea exacta a celulelor unui tabel
Dimensiunea unei celule poate fi stabilită exact cu ajutorul a doua atribute
ale acestor etichete: width pentru lăţime şi height pentru înălţime. Valorile
posibile ale acestor atribute sunt:
numere întregi pozitive (inclusiv 0) reprezentând dimensiunea în pixeli
a lăţimii, respectiv a înălţimii unei celule;
procente din lăţimea , respectiv înălţimea tabelului.
Tabele de forme oarecare
Un tabel trebuie privit ca o reţea dreptunghiulară de celule. Cu ajutorul a
doua atribute ale etichetelor td, o celulă se poate extinde peste celule
vecine, astfel:
extinderea unei celule peste celulele din dreapta ei se face cu ajutorul
atributului colspan a cărui valoare determina numărul de celule care se
unifică.
extinderea unei celule peste celulele dedesubt se face cu ajutorul
atributului rowspan a cărui valoare determina numărul de celule care se
unifica.
Celule vide ale unui tabel
Dacă un tabel are celule vide, atunci acestea vor apărea în tabel fară chenar
de delimitare. Pentru a afişa un chenar, pentru celule vide, se utilizează
după tagul td secvenţa   sau eticheta <br>. Principalele atribute pentru
etichetele <table>, <tr>, <td> şi <th> sunt prezenţate în tabelul 4.
Tabelul 4. Atributele tagului table
<table> align = “center”/ “right” / “left”
border = “nr” (valori in pixeli)= reprezinta grosimea chenarului
width= “ nr” (in pixeli) / “%” (un procent din fereastra curenta) reprezintă latimea
tabelului
height = “nr” (in pixeli) / “%” = reprezintă inaltimea tabelului
bordercolor = “ culoare” (culoare chenarului)
bordercolorlight = “culoare”
bordercolordark =‘‘culoare”
cele 2 atribute coloreaza coltul din stanga sus/dreapta jos.
bgcolor =‘‘culoare” defineşte culoarea de fundal a tabelului
background =‘‘ poza.gif” (aplică o poză de fundal în tabel)
cellspacing =‘‘ nr” (in pixeli) stabileste distanta dintre celule
cellpadding= “nr” stabileste distanta dintre continutul celulei şi marginile acesteia
Atentie!
daca se foloseste cellpadding ar trebui să nu folosim « width » şi « height ».
daca se foloseste cellpadding atunci se aliniaza automat textul din celula pe centrul
acesteia.
<tr>
align = “center”/ “right” / “left” = aliniaza informatia in cadrul randului
bgcolor = “culoare” / “cod culoare” culoarea de fundal a rândului
height = “nr” / “%” stabileste inaltimea randului
<td>
<th>
align = “center” / “right” / “left” = aliniaza textul în celulă
bgcolor = “color” / “cod culoare” coloreaza fundalul celulei respective
width = “nr” / “% ‘‘ inaltimea celulei
rowspan= “nr” numărul de rănduri care se unesc
colspan= “nr” numărul coloane care se unesc
HARŢI DE IMAGINI
(vezi site-ul http://www.utm.ro/live/index.html) figura de mai jos. Imaginea este împărţită în mai multe
secţiuni, iar prin activarea unei secţiuni se deschide un fişier, prin activarea altei secţiuni un alt fişier. Secţiunile se
creează astfel:
Introducem în pagina imaginea care reprezintă harta:
< img src= “harta.gif” usemap= “#numele hartii”>
< map name= “nume harta ‘‘>(acelaşi nume al hartii ca cel de mai sus)
În interior delimităm zonele pentru clic pe mouse astfel:
Area
shape=
“circle” coords= “x,y,r” href= “nume fisier.html” alt= “text alternativ” (explicatii: “circle”
=decupeaza dupa o zona circulara ; x,y= reprezintă coordonatele cercului în pixeli; r=raza
cercului,în pixeli; “nume fisier”=indica numele fisierului deschis la clic; “alt” arata textul
alternativ, care apare ca o eticheta cand pozitionam mouse-ul pe zona delimitata)
“rect” coords= “x1,y1,x2, y2” href= “nume fisier.html” alt= “text” (explicatii: “rect” =
decupeaza dupa o zona dreptunghiulara; “x1,y1”= colt stanga sus; “x2,y2” = colt dreapta)
“poly” coords=‘‘x1,y1,x2,y2,x3,y3,x4,y4....xn,yn” href= “nume fisier.html” alt= “text”
(explicatii: “poly”=de la poligon , decupeaza dupa un poligon; “x1,y1...xn,yn” =unde n trebuie
să aiba valoarea de minim 3 (un poligon are minim 3 laturi, de exemplu, triunghiul); perechile
x,y reprezinta coordonatele )
Harta se inchide cu eticheta: </map>
Exemplu de pagina ce conţine eticheta <map>
Aplicaţie:
Să se creeze un fişier ce conţine o hartă, astfel încăt:
pentru cerc definim valorile: 150, 150, 100.
pentru dreptunghi definim valorile :350,150,550,275,
pentru poligon definim valorile : 350, 400, 200, 500,500.
<html>
<head>
<title>Harti de Imagini </title>
</head>
<body>
<img src=‘‘poze/Imag0061.jpg” width=‘‘400” height=‘‘400” usemap=‘‘#dzip”>
<map name=‘‘dzip”>
<area shape=‘‘circle” coords=‘‘100,100,30” href=‘‘cv.html” alt=‘‘CV” target=‘‘_blank”>
<area shape=‘‘rect” coords=‘‘250,250,350,350” href=‘‘ex1.html” alt=‘‘1”>
<area shape=‘‘poly” coords=‘‘50,350,150,350,100,250” href=‘‘ex1.html” alt=‘‘2”>
</map>
</body>
</html>
1.5 Cadre în HTML (frames)
Cadrele ne permit să definim, în fereastra browser-ului, zone în care să fie încărcate documente HTML diferite.
Cadrele sunt definite într-un fişier HTML special, unde blocul <body>...</body> este înlocuit de blocul
<frameset>...</frameset>.
În interiorul acestui bloc, fiecare cadru este introdus prin eticheta <frame>.
Un atribut obligatoriu al etichetei <frame> este src, care primeşte ca valoare adresa URL a documentului HTML
care va fi apoi încărcat în acel cadru.
Definirea cadrelor se face prin împărţirea ferestrei pe orizontală sau pe verticală cu atributele:
cols împărţirea unei ferestre într-un număr de cadre pe verticală;
rows împărţirea unei ferestre într-un număr de cadre pe orizontală;
-
Valoarea atributelor cols şi rows este o listă de elemente, separate prin virgulă, care descriu modul în care se
face împărţirea. Elementele listei pot fi:
un număr întreg de pixeli;
procente din dimensiunea ferestrei (număr între 1 şi 99 terminat cu %);
n* care înseamnă n părţi din spaţiul rămas;
Exemplul 1: <frameset cols=300,*,50%,*> înseamnă o împărţire în 4 cadre pe verticală, dintre care primul are
300 pixeli, al treilea ocupă jumătate din spaţiul total disponibil, iar al doilea şi al patrulea ocupă, în mod egal, restul
de spaţiu rămas disponibil.
Exemplu 2: <frameset rows=300,1*,50%,2*> înseamnă o împărţire în 4 cadre, dintre care primul are 300 pixeli ,
al treilea ocupă jumătate din spaţiul total disponibil, iar al doilea şi al patrulea ocupă, în mod egal, restul de spaţiu
rămas disponibil, care se împarte în trei părţi egale, al doilea cadru ocupând o parte , iar al patrulea ocupând 2 părţi.
Observatii: dacă mai multe elemente din listă sunt configurate cu * , atunci spaţiul disponibil rămas pentru ele se
va împărţi în mod egal. Într-un cadru se poate încărca un document HTML sau poate fi împărţit la rândul său în alte
cadre (folosind <frameset>).
În exemplul următor, este creată o pagina Web cu trei cadre orizontale. Pentru al doilea cadru valoarea atributului
src este adresa URL a unei imagini.
În exemplul următor, este creată o pagina Web cu trei cadre mixte. Pentru a o crea se procedează din aproape în
aproape. Mai întâi, pagina este împărţită în două cadre de tip coloană, după care al doilea cadru este împărţită în
doua cadre de tip linie.
<html>
<head><title>cadre</title></head>
<frameset cols=‘‘20%,*”>
<frame src=‘‘p1.html”>
<frameset rows=‘‘*,*”>
<frame src=‘‘p1.html”>
<frame src=‘‘p1.html”>
</frameset>
</frameset>
</html>
Culori pentru chenarele cadrelor şi dimensionarea chenarului unui cadru
Pentru a stabili culoarea chenarului unui cadru se utilizează atributul bordercolor. Acest atribut primeşte ca
valoare un nume de culoare sau o culoare definită în conformitate cu modelul de culoare RGB. Atributul
bordercolor poate fi ataşat atât etichetei <frameset> pentru a stabili culoarea tuturor chenarelor cadrelor
incluse, cât şi etichetei <frame> pentru a stabili culoarea chenarului pentru un cadru individual. Atributul border
al etichetei <frameset> permite configurarea lăţimii chenarelor tuturor cadrelor la un număr dorit de pixeli.
Valoarea prestabilita a atributului border este de 5 pixeli. O valoare de 0 pixeli va defini un cadru fără chenar. În
mod prestabilit, chenarul unui cadru este afişat şi are aspect tridimensional. Afişarea chenarului unui cadru se poate
dezactivata dacă se utilizează atributul frameborder cu valoare ‘‘no”. Acest atribut poate fi ataşat atât etichetei
<frameset> cât şi etichetei <frame> (dezactivarea fiind valabilă numai pentru un singur cadru). Valorile posibile ale
atributului frameborder sunt: ‘‘yes” - echivalent cu 1; ‘‘no” - echivalent cu 0;
Bare de defilare
Atributul scrolling al etichetei <frame> este utilizat pentru a adăuga unui cadru o bară de derulare care
permite navigarea în interiorul documentului afişat în interiorul cadrului. Valorile posibile sunt:
‘‘yes” - barele de derulare sunt adăugate întotdeauna;
‘‘no” - barele de derulare nu sunt utilizabile;
‘‘auto” - barele de derulare sunt vizibile atunci când este necesar.
Atributul noresize al etichetei <frame> (fără nici o valoare suplimentară) dacă este prezent, inhibă posibilitatea
prestabilită a utilizatorului de a redimensiona cadrul cu ajutorul mouse-ului.
Poziţionarea documentului într-un cadru
Atributele marginheight şi marginwidth ale etichetei <frame> permit stabilirea distanţei în pixeli dintre
conţinutul unui cadru şi marginile verticale, respectiv orizontale ale cadrului . Valori posibile sunt: numărul de
pixeli sau procent din lăţimea, respectiv din înălţimea cadrului;
Cadre interne (în-line)
Un cadru intern este specificat prin intermediul blocului <iframe>...</iframe>. Acesta se introduce într-o pagina
Web în mod asemănător cu o imagine aşa cum rezulta din următorul exemplu: <iframe src=‘‘ex_3.1.html” height=40% width=50%> </iframe>
În acest caz, am specificat un cadru intern care are 40% din înălţimea şi 50% din lăţimea paginii curente.
Atributele acceptate de eticheta <iframe> sunt în parte preluate de la etichetele <frame> şi <frameset>, cum ar fi:
src, border, frameborder, bordercolor, marginheight, marginwidth, scrolling, name, noresize; sau de la eticheta
<img> vspace, hspace, align, width, height;
Ţinte pentru legaturi
În mod prestabilit, la efectuarea unui clic pe o legătura noua pagină (către care indică legătura) o înlocuieşte pe cea
curentă în aceeaşi fereastră (acelaşi cadru). Acest comportament se poate schimba în doua moduri:
prin plasarea în blocul <head>...</head> a unui element <base> care precizează, prin atributul target
numele ferestrei (cadrului) în care se vor încărca toate paginile noi referite de legaturile din pagina curenta
conform sintaxei:
<base target=‘‘nume_ferastra/frame_de_baza”> ;
prin plasarea în eticheta <a> a atributului target, care precizează numele ferestrei (cadrului) în care se va
încărca pagina nou referită de legătură, conform sintaxei: <a href=‘‘fişier.html” target=‘‘nume fereastra/frame”> ... </a> .
Observaţie.
Daca este prezent atât un atribut target în <base>, cât şi un atribut target în <a>, atunci cele precizate de
atributul target din <a> sunt prioritare.
Numele unui cadru este stabilit prin atributul name al etichetei <frame> conform sintaxei: <frame name=‘‘nume cadru”>
Valori pentru atributul target
Atributul target al etichetei<frame> accepta anumite valori predefinite care sunt:
Target ‘‘_self” (încărcarea noii pagini are loc în cadrul curent);
‘‘_blank” (încărcarea noii pagini are loc într-o fereastra noua anonima);
‘‘_parent” (încărcarea noii pagini are loc în cadrul parinte al cadrului
curent daca acesta exista, altfel are loc în fereastra browserului curent);
‘‘_top” (încărcarea noii pagini are loc în fereastra browserului ce contine cadrul
curent)
1.6 Definirea formularelor
Un formular este un ansamblu de zone active alcătuit din butoane, casete de selecţie, câmpuri de editare etc.
Formularele sunt utilizate pentru construirea unor pagini Web care permit utilizatorilor să introducă efectiv
informaţii şi să le transmită serverului. Formularele pot varia de la o simplă casetă de text, pentru introducerea unui
şir de caractere pe post de cheie de căutare - element caracteristic tuturor motoarelor de căutare din Web - până la o
structură complexă, cu multiple secţiuni, care oferă facilităţi puternice de transmisie a datelor. O sesiune cu o
pagina web ce conţine un formular are următoarele etape:
utilizatorul completează formularul şi îl expediază unui server;
aplicaţie dedicată de pe server analizează formularul completat şi (dacă este necesar) stochează datele într-o
bază de date;
dacă este necesar serverul expediază un răspuns utilizatorului.
Un formular este definit într-un bloc delimitat de etichetele corespondente <form> şi </form>.
Atribute esenţiale ale elementului <form>
- atributul action precizează ce se va întâmpla cu datele formularului odată ce acestea ajung la destinaţie. De
regulă, valoarea atributului action este adresa URL a unui script aflat pe un server WWW care primeşte
datele formularului, efectuează o prelucrare a lor şi expediază către utilizator un raspuns.
<form action=‘‘http://www.yahoo.com/cgi - bin/nume_fis.cgi‘‘>.
Script-urile pot fi scrise în limbajele CGI, Perl, C, PHP, Unix shell etc.
- atributul method precizează metodă utilizata de browser pentru expedierea datelor formularului. Sunt posibile
următoarele valori:
- get (valoarea implicita). În acest caz ,datele din formular sunt adăugate la adresa URL precizata
de atributul action; nu sunt permise cantităţi mari de date (maxim 1 Kb)- între adresa URL şi
date este inserat un ‘‘?”. Datele sunt adăugate conform sintaxei: nume_camp =
valoare_camp. Între diferite seturi de date este introdus un ‘‘&”. Exemplu: ‘‘http://www.yahoo.com/cgi-bin/nume_fis.cgi?nume1 = valoare1&nume2
= valoare2”;
- post. În acest caz datele sunt expediate separat. Sunt permise cantităţi mari de date (ordinul MB)
Pentru ca un formular să fie funcţional, trebuie precizat ce se va întâmpla cu el, după completare şi expediere. Cel
mai simplu mod de utilizare a unui formular este expedierea acestuia prin posta electronica (e-mail). Pentru aceasta
se foloseşte atributul action care primeşte ca valoare ‘‘mailto:adresa e-mail”.
Formular cu câmp de editare şi buton de expediere
Majoritatea elementelor unui formular sunt definite cu ajutorul etichetei <input>. Pentru a preciza tipul
elementului se foloseşte atributul type al etichetei <input>. Pentru un câmp de editare, acest atribut primeşte
valoarea ‘‘text”. Alte atribute pentru un element <input> sunt:
atributul name ,permite ataşarea unui nume fiecărui element al formularului.
atributul value ,care permite atribuirea unei valori iniţiale unui element al formularului.
un buton de expediere al unui formular se introduce cu ajutorul etichetei <input>, în care atributul type
este configurat la valoarea ‘‘submit”. Acest element poate primi un nume prin atributul name. Pe buton
apare scris ‘‘Submit Query” sau valoarea atributului value , dacă aceasta valoare a fost stabilită.
Pentru elementul <input> de tipul câmp de editare (type = ‘‘text”) , alte doua atribute pot fi utile:
atributul size specifica lăţimea câmpului de editare;
atributul maxlength specifica numărul maxim de caractere pe care le poate primi un câmp de editare.
-
- Observaţii:
daca atributul type lipseşte într-un element <input> , atunci câmpul respectiv este considerat în mod
prestabilit ca fiind de tip ‘‘text”.
Formularele, cu un singur câmp (de tip text), nu au nevoie de un buton de expediere, datele sunt expediate
automat după completarea şi apăsarea tastei ENTER.
Butoane
Butonul Reset
Daca un element de tip <input> are atributul type configurat la valoarea ‘‘reset”, atunci în formular se introduce
un buton pe care scrie ‘‘Reset”. La apăsarea acestui buton, toate elementele din formular primesc valorile
prestabilite (definite odată cu formularul), chiar dacă aceste valori au fost modificate de utilizator. Un buton Reset
poate primi un nume cu ajutorul atributului name şi o valoare printr-un atribut value. Un asemenea buton
afişează textul ‘‘Reset”, dacă atributul value lipseşte, respectiv valoarea acestui atribut în caz contrar .
Câmp de editare de tip ‘‘password”
Daca se utilizează eticheta <input> având atributul type, configurat la valoarea ‘‘password”, atunci în formular
se introduce un element asemănător cu un câmp de editare obişnuit (introdus prin type=‘‘text”).
Toate atributele unui câmp de editare rămân valabile. Singura deosebire constă în faptul că acest câmp de editare
nu afişează caracterele în clar.
Butoane radio
Butoanele radio permit alegerea, la un moment dat, a unei singure variante din mai multe posibile. Acestea se
introduc ca familii de butoane prin eticheta <input> cu atributul type avand valoarea ‘‘radio”, iar atributul name
trebuie să primească aceeaşi valoare pentru fiecare buton dintr-o familie.
La expedierea formularului se va transmite una dintre perechile ‘‘sex=m” sau ‘‘sex=f”, în funcţie de alegerea făcută
de utilizator.
Casete de validare
O caseta de validare (checkbox) permite selectarea sau deselectarea unei opţiuni.
- Pentru inserarea unei casete de validare se utilizeaza eticheta <input> cu atributul type configurat la
valoarea ‘‘checkbox” .
Observaţii.
fiecare casetă poate avea un nume definit prin atributul name;
fiecare casetă, la fel ca şi butonul radio, poate avea valoarea prestabilita ‘‘selectat”, definită cu atributul checked.
Casete de fişiere
Pentru pereche ‘‘name şi value” a unui formular se poate utiliza întregul conţinut al unui fişier pe post de valoare.
Pentru aceasta se inserează un element <input> într-un formular, cu atributul <type> având valoarea ‘‘file” (fişier).
Atributele pentru un element de tip casetă de fişiere sunt:
atributul name ce permite ataşarea unui nume;
atributul value ce primeşte ca valoare adresa URL a fişierului care va fi expediat o data cu formularul.
Această valoare poate fi atribuită direct atributului value, poate fi tastata într-un câmp de editare ce apare
o data cu formularul sau poate fi selectată prin intermediul unei casete de tip File Upload sau Choose File
care apare la apăsarea butonului Browse... din formular .
Liste de selectie
O lista de selectie permite utilizatorului să aleagă unul sau mai multe elemente dintr-o listă finită. Lista de selecţie
este inclusă în formular cu ajutorul etichetelor corespondente <select> şi </select>. O listă de selecţie poate avea
următoarele atribute:
atributul name, care ataşează listei un nume (utilizat în perechile ‘‘name=value” expediat serverului);
atributul size, care precizează (printr-un număr întreg pozitiv , valoarea prestabilita fiind 1) câte elemente
din listă sunt vizibile la un moment dat pe ecran (celelalte devenind vizibile prin acţionarea barei de
derulare ataşate automat listei).
Elementele unei liste de selecţie sunt incluse în lista cu ajutorul etichetei <option>. Doua atribute ale etichetei
option se dovedesc utile:
atributul value primeste ca valoare un text care va fi expediat server-ului în perechea ‘‘name=value”; dacă
acest atribut lipseşte , atunci către server va fi expediat textul ce urmează după <option>;
atributul selected (fără alte valori) permite selectarea prestabilita a unui element al listei.
Câmpuri de editare multilinie
Într-un formular câmpuri de editare multilinie pot fi incluse cu ajutorul etichetei <textarea>. Eticheta are
următoarele atribute:
atributul cols, care specifica numărul de caractere afişate într-o linie;
atributul rows, care specifica numărul de linii afişate simultan;
atributul name, care permite ataşarea unui nume câmpului de editare multilinie;
atributul wrap, care determină comportamentul câmpului de editare faţă de sfârşitul de linie.
Într-un formular pot fi afişate butoane fără un rol prestabilit. Când utilizatorul apasă un buton, se lansează în
execuţie o funcţie de tratare a acestui eveniment. Limbajul HTML nu permite scrierea unor astfel de funcţii (acest
lucru este posibil daca se utilizează limbaje de scriptare precum JavaScript, VBScript). Pentru a insera un buton
într-un formular , se utilizează eticheta <input> având atributul type configurat cu valoarea ‘‘button”. Alte doua
atribute ale elementului ‘‘button” sunt:
atributul name, care permite ataşarea unui nume butonului
atributul value, care primeşte ca valoare textul ce va fi afisat pe buton.
1.7 Stiluri
Stilurile pun la dispoziţia creatorilor de site-uri noi posibilităţi de personalizare a paginilor Web. Un stil reprezintă
un mod de a scrie un bloc de text (adică anumite valori pentru font, mărime, culoare, aliniere, distanţe faţă de
margini etc).
Exista doua modalităţi de a defini un stil:
sintaxa CSS (Cascading Style Sheets);
sintaxa Javascript.
Stilurile sunt introduse în doi paşi care sunt:
definirea stilului;
precizarea domeniului de aplicare a stilului.
Stilurile se pot defini in fisiere externe cu extensia CSS, astfel incat se pot utiliza toate proprietatile CSS
si se asociaza cu documentele HTML cat si XML.
In HTML, legatura cu documentul CSS extern se precizeaza in interiorul elementului astfel <head>:
<link rel=”stylesheet” type=”text/css” href=”exemplu.css” /> </head>
Pentru XML: <?xml-stylesheet href=”exemplu.css” type=”text/css”?>
Stilurile sunt de finite în cadrul blocului <head>…</head> între etichetele <style>…</style>. În funcţie de modul
de definire, putem avea:
Stiluri dedicate
Aceste stiluri se aplica blocurilor de text pentru care sunt definite. De exemplu:
<head><style>
h1 {text-align:center; color:red;}
</style>
</head>
Toate titlurile care apar în pagina ca fiind de mărime 1 vor fi de culoare roşie şi centrate. Daca dorim ca acelaşi stil
să fie utilizat de către mai multe elemente (de ex. ‘‘h1”, ‘‘h2”, şi ‘‘p”) atunci se utilizează o lista acestor elemente,
separate prin virgula:
<style>
h1, h2, p {text-align:center; color:red;}
</style>
Clase de stiluri
Aceste stiluri permit definirea unui stil general şi folosirea lui oriunde este necesar. Exemplu: Definim o clasă de
stiluri ‘‘ac” (albastru şi centrat) în interiorul blocului <style>...</style>, aflat la rândul lui în blocul
<head>...</head>:
<style>
.ac {text-align:center; color:blue;}
</style>
Dacă dorim ca un titlu de mărimea 2 să folosească clasa de stiluri ‘‘ac” atunci scriem: <h2 class = ac>Acesta
este un header de marime 2 albastru şi centrat</h2>
Stiluri ‘‘identificate”
Toate elementele unui document admite un atribut universal numit id. Atributul id poate identifica stilul utilizat
de un element. Pentru a utiliza un stil ‘‘identificat” procedaţi astfel:
- în blocul <style>...</style> introduceţi definiţia stilului conform sintaxei:
<style>
#verde { color: green }
</style>
Configurarea fontului folosind stilurile
Mărimea fontului este stabilită prin atributul font-size. Valori posibile:
- predefinite: xx-small, x-small, small, medium, large, x-large, xx-large
- număr urmat de unitate de măsură (pt, px, în, mm, cm)
Tipul fontului este stabilită prin atributul font-family: listă de fonturi separate prin virgula. Se pot utiliza cele 5
familii generice: serif, sans-serif, cursive, monospace, fantasy.
Grosimea fontului - font-weight: valori posibile:
- normal, bold, bolder, lighter.
- numere între 100 (cel mai subtire) şi 900 (cel mai gros)
Stilul fontului - font-style: normal, italic, oblique
<html>
<head><title>configurarea fontului</title>
<style>
#s1 {font-size:16pt; font-family:verdana;}
#s2 { font-size:2cm; font-family:Arial; font-weight:900}
#s3 { font-size:20px; font-family:fantasy;font-style:italic;}
</style>
</head>
<body>
<div id=‘‘s1”>text introdus cu font verdana, dimensiune 16pt</div>
<div id=‘‘s2”>text introdus cu font arial, dimensiune 2 cm, ingrosat</div>
<div id=‘‘s3”>text introdus cu font generic fantasy, dimensiune 20 pixeli, inclinat</div> </body> </html>
- Culoarea textului este stabilită prin atributul color. Culoarea fondului textului este stabilită prin
atributul background-color. Valorile posibile sunt aceleaşi cu ale atributului color.
Imaginea de fond a textului este stabilită prin atributul background-image = url(”adresa imaginii folosite”).
Alinierea textului este stabilită prin atributul text-align: left, center, right, justify. Decorarea textului este
stabilită prin atributul text-decoration: none, underline, line-through, overline.
<html>
<head><title>configurarea textului</title>
<style>
#s1 {color:red;background-color:yellow;text-align:center}
#s2 { color:cyan;background-color:black;text-align:right}
#s3 { color:BLACK;background-image:url(”w3.gif”);text-decoration:overline}
</style></head><body>
<div id=s1>text rosu pe fundal galben</div>
<div id=s2>text cyan pe fundal negru</div>
<div id=s3>text cu imagine de fundal<br> text cu imagine de fundal<br> text cu
imagine de fundal<br> text cu imagine de fundal<br> text cu imagine de
fundal<br> text cu imagine de fundal<br>
</div></body></html>
Font Properties
Font Family
Font Style
Font Variant
Font Weight
Font Size
Font
Font Family
Syntax: font-family: [[<family-name> | <generic-family>],]*
[<family-name> | <generic-family>]
Possible Values: <family-name>
Any font family name may be used
<generic-family>
serif (e.g., Times)
sans-serif (e.g., Arial or Helvetica)
cursive (e.g., Zapf-Chancery)
fantasy (e.g., Western)
monospace (e.g., Courier)
Initial Value: Determined by browser
Applies to: All elements
Inherited: Yes
P { font-family: ‘‘New Century Schoolbook”, Times, serif }
Font Style
Syntax: font-style: <value>
Possible Values: normal | italic | oblique
Initial Value: normal
Applies to: All elements
Inherited: Yes
H1 { font-style: oblique }
P { font-style: normal }
Font Variant
Syntax: font-variant: <value>
Possible Values: normal | SMALL-CAPS
Initial Value: normal
Applies to: All elements
Inherited: Yes
SPAN { font-variant: small-caps }
Font Weight
Syntax: font-weight: <value>
Possible Values: normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600
| 700 | 800 | 900
Initial Value: normal
Applies to: All elements
Inherited: Yes
H1 { font-weight: 800 }
P { font-weight: normal }
Font Size
Syntax: font-size: <absolute-size> | <relative-size> | <length> |
<percentage>
Possible Values: <absolute-size>
xx-small | x-small | small | medium | large | x-large |
xx-large
<relative-size>
larger | smaller
<length>
<percentage> (in relation to parent element)
Initial Value: medium
Applies to: All elements
Inherited: Yes
H1 { font-size: large }
P { font-size: 12pt }
LI { font-size: 90% }
STRONG { font-size: larger }
H1 { font-size: 200% }
Font
Syntax: font: <value>
Possible
Values: [ <font-style> || <font-variant> || <font-weight> ]? <font-
size> [ / <line-height> ]? <font-family>
Initial Value: Not defined
Applies to: All elements
Inherited: Yes
P { font: italic bold 12pt/14pt Times, serif }
Color and Background Properties
Color
Background Color
Background Image
Background Repeat
Background Attachment
Background Position
Background
Color
Syntax: color: <color>
Initial Value: Determined by browser
Applies to: All elements
Inherited: Yes
H1 { color: blue }
H2 { color: #000080 }
H3 { color: #0c0 }
Background Color
Syntax: background-color: <value>
Possible Values: <color> | transparent
Initial Value: transparent
Applies to: All elements
Inherited: No
BODY { background-color: white }
H1 { background-color: #000080 }
Background Image
Syntax: background-image: <value>
Possible Values: <url> | none
Initial Value: none
Applies to: All elements
Inherited: No
BODY { background-image: url(/images/foo.gif) }
P { background-image: url(http://www.htmlhelp.com/bg.png) }
Background Repeat
Syntax: background-repeat: <value>
Possible Values: repeat | repeat-x | repeat-y | no-repeat
Initial Value: repeat
Applies to: All elements
Inherited: No
BODY { background: white url(candybar.gif);
background-repeat: repeat-x }
Background Attachment
Syntax: background-attachment: <value>
Possible Values: scroll | fixed
Initial Value: scroll
Applies to: All elements
Inherited: No
BODY { background: white url(candybar.gif);
background-attachment: fixed }
Background Position
Syntax: background-position: <value>
Possible Values: [<percentage> | <length>]{1,2} | [top | center |
bottom] || [left | center | right]
Initial Value: 0% 0%
Applies to: Block-level and replaced elements
Inherited: No
Horizontal keywords (left, center, right)
Vertical keywords (top, center, bottom)
Background
Syntax: background: <value>
Possible Values: <background-color> || <background-image> ||
<background-repeat> || <background-attachment> ||
<background-position>
Initial Value: Not defined
Applies to: All elements
Inherited: No
BODY { background: white url(http://www.htmlhelp.com/foo.gif) }
BLOCKQUOTE { background: #7fffd4 }
P { background: url(../backgrounds/pawn.png) #f0f8ff fixed }
TABLE { background: #0c0 url(leaves.jpg) no-repeat bottom right }
Text Properties
Word Spacing
Letter Spacing
Text Decoration
Vertical Alignment
Text Transformation
Text Alignment
Text Indentation
Line Height
Word Spacing
Syntax: word-spacing: <value>
Possible Values: normal | <length>
Initial Value: normal
Applies to: All elements
Inherited: Yes
The word-spacing property defines an additional amount of space between words. The value must be in the length
format; negative values are permitted.
Examples:
P EM { word-spacing: 0.4em }
P.note { word-spacing: -0.2em }
Letter Spacing
Syntax: letter-spacing: <value>
Possible Values: normal | <length>
Initial Value: normal
Applies to: All elements
Inherited: Yes
The letter-spacing property defines an additional amount of space between characters. The value must be in the
length format; negative values are permitted. A setting of 0 will prevent justification.
Examples:
H1 { letter-spacing: 0.1em }
P.note { letter-spacing: -0.1em }
Text Decoration
Syntax: text-decoration: <value>
Possible Values: none | [ underline || overline || line-through || blink ]
Initial Value: none
Applies to: All elements
Inherited: No
The text-decoration property allows text to be decorated through one of five properties: underline, overline, line-
through, blink, or the default, none.
For example, one can suggest that links not be underlined with
A:link, A:visited, A:active { text-decoration: none }
Vertical Alignment
Syntax: vertical-align: <value>
Possible Values: baseline | sub | super
| top | text-top | middle | bottom
| text-bottom | <percentage>
Initial Value: baseline
Applies to: Inline elements
Inherited: No
The vertical-align property is particularly useful for aligning images. Some examples follow:
IMG.middle { vertical-align: middle }
IMG { vertical-align: 50% }
.exponent { vertical-align: super }
Text Transformation
Syntax: text-transform: <value>
Possible Values: none | capitalize | UPPERCASE | lowercase
Initial Value: none
Applies to: All elements
Inherited: Yes
H1 { text-transform: uppercase }
H2 { text-transform: capitalize }
Text Alignment
Syntax: text-align: <value>
Possible Values: left | right | center | justify
Initial Value: Determined by browser
Applies to: Block-level elements
Inherited: Yes
H1 { text-align: center }
P.newspaper { text-align: justify }
Text Indentation
Syntax: text-indent: <value>
Possible Values: <length> | <percentage>
Initial Value: 0
Applies to: Block-level elements
Inherited: Yes
P { text-indent: 5em }
Line Height
Syntax: line-height: <value>
Possible Values: normal | <number> | <length> | <percentage>
Initial Value: normal
Applies to: All elements
Inherited: Yes
P { line-height: 200% }
Orice tip de continut(text sau imagine) este incadrat intr-o boxa de afisare, marginita de zonele de
padding, border si margin, fiecare avand laturile: top, left, bottom si right.
Borduri in css
1.8 Straturi
Un strat este văzut ca un bloc de text sau elemente HTML, care poate fi dimensionat şi poziţionat cu exactitate în
pagină. Straturile pot fi transparente sau opace şi se pot suprapune. Se definesc cu ajutorul atributelor stilurilor şi se
introduc în pagina prin marcaje <div> sau <span>. Un strat moşteneşte toate atributele stilurilor şi acceptă şi
atribute referitoare la dimensiune şi poziţionare. Dimensiunile unui strat se stabilesc prin atributele width şi
height. Ca valori pot primi un număr urmat de unitate de măsură. Poziţionarea unui strat poate fi de doua tipuri:
absolută, stratul fiind poziţionat în funcţie de colţul din stânga sus al ferestrei sau a blocului din care face
parte
relativă, stratul fiind poziţionat în funcţie de ultimul element introdus în pagina
Tipul poziţionării este stabilit prin atributul position cu valorile posibile absolute sau relative. Poziţia stratului este
stabilita cu ajutorul atributelor top şi left. Chenarul unui strat este stabilită prin atributul border-style cu valori
posibile: none, solid, dotted, dashed, double, inset, outset, groove, ridge. Culoarea chenarului este stabilită prin
atributul border-color. Grosimea chenarului este stabilită prin atributul border-width: număr cu unitate de
măsură.
Dacă straturile conţin şi culoare de fundal atunci ele sunt opace.Exemplu de poziţionare relativă pentru un text
afişat unduitor .
Întrebări de control
- Definiti notiunile WWW, FTP , HTTP, IRC, HTML.
- Definiti notiunea de site web, browser, motor de cautare.
- Definiti sturctura unei pagini web. Exemplu.
- Explicati elementele care apar in cadrul formularelor
(form).
- Definiti stilurile (CSS-urile) si explicati cum se pot apela
acestea.Exemple.
UUnniittaatteeaa ddee iinnvvaattaarree IIII..
JJAAVVAASSCCRRIIPPTT
Aceasta unitate de invatare are ca scop cunoasterea si utilizarea limbajului Javascript, pentru
realizarea site-urilor web. JavaScript este un limbaj de scriptare având o sintaxă apropiată de cea a
limbajului C. Comenzile JavaScript sunt incluse în pagina Web, împreună cu textul şi marcajele care
formează conţinutul acesteia şi sunt interpretate de către browser. Nu toate browserele sunt capabile să
execute comenzile JavaScript. JavaScript este un limbaj bazat pe obiecte.
Materialu
l trebuie
parcurs
în
ordinea
sa
firească
prezentat
ă în continuare, inclusiv în zona referitoare la aplicatii. Se recomandă testarea si notarea
sintaxei functiilor. Timpul minim pe care trebuie să-l acordati acestui modul este de 8 ore.
2.1. Prezentare generală JavaScript şi Java
Java este un limbaj de programare orientat obiect, dezvoltat de firma Sun Microsystems, în timp
ce JavaScript are o structură bazată pe obiecte şi a fost dezvoltat de firma Netscape
Communications. Limbajul Java poate fi folosit pentru proiectarea de aplicaţii independente sau
pentru proiectarea de microaplicaţii care pot fi incluse în cadrul paginilor Web şi care poartă
După parcurgerea si însusirea acestei teme, studentul va putea sa:
- utilizeze functiile javascript;
- utilizeze evenimente JavaScript;
- sa operezecu obiectele din JavaScript;
- sa scrie secvente de cod Javascript;
Cuprins:
2. Javascript
2.1. Prezentare generală
2.2. Mesajul<script type=”text/javascript”>
2.3. Elementele limbajului Java Script
2.4. Funcţii şi evenimente în Java Script
2.5. Obiecte în Java Script
denumirea de applet-uri şi sunt şi ele independente de platformă. Iată câteva deosebiri esenţiale
între Java şi JavaScript:
aplicaţiile Java sunt compilate în fişiere binare care sunt apoi interpretate de către VJM
(Virtual Java Machine - Maşină Virtuală Java), în timp ce codul JavaScript este transmis
ca un text obişnuit şi este interpretat.
Java este orientat obiect în timp ce JavaScript este bazat pe obiecte.
codul JavaScript este inclus în cadrul documentului HTML; applet-urile Java sunt referite
din cadrul unui document HTML, dar codul se află într-un fişier separat.
script-urile JavaScript sunt incluse prin intermediul marcajului <script
type=‘‘text/javascript”>, iar applet-urile Java prin intermediul marcajului <OBJECT>;
există şi marcajul <APPLET> dar folosirea lui nu mai este recomandată.
în cadrul script-urilor JavaScript variabilele nu trebuie declarate, în timp ce în cadrul
aplicaţiilor Java variabilele trebuie declarate înainte de a fi folosite. Mai mult, în cadrul
script-urilor JavaScript, o variabilă care este considerată ca având un anumit tip la un
moment dat poate fi considerată ulterior ca având un alt tip; de exemplu, o variabilă poate
fi folosită ca fiind un şir de caractere pentru ca apoi să fie considerată ca fiind un număr
real.
JavaScript foloseşte legarea dinamică, adică referinţele sunt verificate în timpul rulării, în
timp ce Java foloseşte legarea statică, adică referinţele trebuie să existe în momentul
compilării.
În general, limbajul JavaScript este folosit pentru efectuarea de calcule, citirea unor date
dintr-o tabelă, proiectarea de ecrane HTML fără a folosi script-uri CGI.
2.2 Marcajul <script type=‘‘text/javascript”>
În interiorul unui document HTML, instrucţiunile JavaScript sunt cuprinse, de obicei, în
interiorul marcajului <script type=‘‘text/javascript”>. Acest marcaj poate apărea atât în antetul
documentului HTML (marcajul <HEAD>), cât şi în corpul documentului (marcajul <BODY>).
Script-urile definite în antet sunt încărcate înaintea încărcării restului paginii, antetul fiind un loc
excelent pentru plasarea funcţiilor JavaScript pentru a fi siguri că acestea vor fi disponibile atunci
când sunt apelate în alte secţiuni ale documentului HTML. Pentru a insera cod JavaScript într-un
document HTML deja existent, este necesara introducerea în fisier a etichetei <script
type=‘‘text/javascript”> ....... </script>. Aceasta eticheta are aributul ‘‘type”, sau ‘‘language” (
acesta din urma este depreciat in standardul XHTML) care va specifica browserului limbajul
folosit pentru interpretarea codului inclus. In interiorul etichetei <script type=‘‘text/javascript”>
... </script> vom scrie codul sursă.
Exemplu de script-ul prin intermediul căruia poate fi afişat mesajul ‘‘Hello World!” în fereastra
programului de navigare.
Instructiunile JavaScript se pot introduce şi într-un alt fisier extern, care va avea extensia ‘‘.js”,
iar pentru editarea acestui fisier se poate utiliza un editor simplu de texte. Avantajul este că se
poate utiliza acelaşi cod în mai multe pagini HTML.
Dacă codul JavaScript se afla într-un fisier extern, eticheta
<script type=‘‘text/javascript”>
va trebui să contina să atributul ‘‘src” a carui valoare determina locatia fisierului in care se afla
codul JavaScript. In fisierul extern cu extensia ‘‘js” nu trebue să scriem eticheta ‘‘<script
type=‘‘text/javascript”>‘‘, se scriu direct instructiunile scriptului. Dacă fişierul extern este
info.js, atunci fişierul HML care apelează fişierul extern .JS arată:
Fisierele JavaScript externe nu pot conţine decât declaraţii şi funcţii JavaScript, iar extensia trebuie
să fie .js.
Comentarii în Javascript
La versiuni mai vechi de browsere, instrucţiunile JavaScript sunt scrise între comentarii. Sintaxa generala
este:
<script type=‘‘text/javascript”>
<! - - Inceput comentariu
Instructiuni JavaScript
<! - - Sfarsitul comentariului - - >
<!DOCTYPE html PUBLIC ‘‘-//W3C//DTD XHTML 1.0 Strict//EN”
‘‘http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html xmlns=‘‘http://www.w3.org/1999/xhtml” lang=‘‘en”>
<head>
<meta http-equiv=‘‘Content-Type” content=‘‘text/html; charset=utf-8” />
<title>Test JavaScript</title>
<title>Cod JavaScript</title>
</head>
<body>
<script type=‘‘text/javascript”>
document.write(”Hello World! ‘‘);
</script>
</body>
</html>
<!DOCTYPE html PUBLIC ‘‘-//W3C//DTD XHTML 1.0 Strict//EN”
‘‘http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html xmlns=‘‘http://www.w3.org/1999/xhtml” lang=‘‘en”>
<head>
<meta http-equiv=‘‘Content-Type” content=‘‘text/html; charset=utf-8” />
<title>Test JavaScript</title>
<title>Cod JavaScript</title>
<script src=‘‘info.js” type=‘‘text/javascript”>
</script></head>
<body>….
</body> </html>
</SCRIPT>
Proiectanţii introduc instrucţiunile JavaScript între comentarii HTML astfel încât browserele care nu
permit JavaScript vor ignora instrucţiunile, interpretându-le drept comentarii. Comentariile în JavaScript
pt fi definite ca în (applet-urile) JAVA, C şi C++ astfel:
/* Comentariu pe mai multe linii
*/
// Comentariu pe o singură linie
2.3 Elementele limbajului JavaScript
Elementele limbajului pot fi:
JavaScript este un limbaj “dinamic-tipizat” sau “slab-tipizat” (loosely-typed), ceea ce înseamnă
că nu trebuie să specific tipul unei variabile când o declar fiindcă ea va fi convertită automat dacă
va fi nevoie în timpul execuţiei scriptului. O variabilă se poate declara în două moduri:
atribuindu-i o valoare: x=124
cu ajutorul cuvântului rezervat var: var x=124
O variabilă JavaScript căreia nu i-a fost atribuită o valoare va avea valoarea undefined. Rezultatul
evaluării unei variabile depinde de modul în care a fost declarată, astfel:
- dacă variabilei nu i-a fost atribuită o valoare şi a fost declarată fără var rezultatul evaluării
variabilei va fi o eroare runtime.
- dacă variabilei nu i-a fost atribuită o valoare, dar a fost declarată folosind cuvăntul rezervat var
rezultatul evaluării variabilei va fi undefined sau NaN în context numeric.
Variabilele, definite în afara funcţiilor, se numesc variabile globale şi ele sunt accesibile oriunde
în documentul curent. Variabilele, definite în interiorul funcţiilor, se numesc variabile locale şi
ele sunt vizibile numai în interiorul funcţiilor în care sunt declarate.
Şiruri (de caractere) JavaScript
Într-un scenariu JavaScript, şirurile de caractere constante se delimitează între apostrofuri simple
sau duble.
Operatorul '+' semnifica concatenarea şirurilor de caractere. Ca şi în C, JAVA, şirurile de
caractere pot conţine secvenţe Escape: \n, \t, \f etc.
În JavaScript sunt admise urmatoarele categorii de expresii: aritmetice,şiruri de caractere şi
logice.
Operatorii utilizaţi de limaj pot fi:
Numerele care pot fi: numere întregi şi numere reale ,
Boolean ce are valorile true şi false,
null este o valoare nedefinită,
undefined: o proprietate de nivel superior poate avea valoarea undefined,
NaN: Not a Number,
String ‘text’. Pentru orice literal de tip string se utilizează metodele clasei String.
Vectori şi elemente de tip Obiect .
Matematici:
+, -, *, /, ^, %(modulo)
- unari: se aplică la un singur operand: a++, a—
- binari: se aplică la 2 operanzi:
a+b, a-b
a+=2 echivalent cu a=a+2
De comparaţie, folosiţi pentru scrierea unor expresii logice. La evaluarea acestora se poate
obţine true sau false: <, >, <=, >=, ==, !=
Există în JavaScript o serie de funcţii predefinite cum ar fi:
Preluarea de intrări tip text de la utilizator În cazul când este nevoie de citirea unei linii text de la utilizator, se poate utiliza funcţia prompt
pentru afişarea unei casete de dialog care oferă utilizatorului un prompter (cursor) pentru a
introduce date şi pentru preluarea ulterioara a intrării utilizatorului. Funcţia arată prompt ( text,
[valoare iniţiala] ) şi provoacă apariţia unei casete în care utilizatorul va putea introduce un şir
de caractere. Caseta conţine şi un buton 'OK' . Controlul de editare este iniţializat cu valoare
iniţială, dacă acest argument este prezent, altfel este iniţializat cu textul (undefined)/
Funcţia EVAL se utilizează pentru a converti un şir de caractere la o valoare întreagă.
Funcţia confirm() are rolul de a crea o fereastră prin intermediul căreia se cere confirmarea
utilizatorului pentru efectuarea unei acţiuni. Funcţia returnează o valoare logică (true sau false),
iar sintaxa ei este confirm(mesaj).
Fereastra creată are două butoane: Ok şi Cancel, nu poate fi minimizată sau redimensionată şi are
un buton special pentru închidere. În cazul apăsării butonului Ok sau a tastei ENTER valoarea
returnată este true, iar în cazul apăsării butonului Cancel, a butonului de închidere sau a tastei
ESC valoarea returnată este false .
Obiectul document În JavaScript, obiectul document corespunde documentului HTML curent. Daca un script
utilizează metodă write pentru obiectul document în vederea afişării ieşirii, browserul va reda
ieşirea în documentul curent.Exemple de utilizare:
document.write(”text”)
eval(expr): evaluează o expresie data ca şi parametru (string);
isFinite(number) : determină dacă argumentul este un număr finit;
isNaN(testValue) : determina dacă testValue este NaN;
parseFloat(str) : transformă stringul str în valoare float şi o returnează;
parseInt(str [, radix]) : transformă str într-o valoare de tip întreg şi o returnează; radix este
baza de numeraţie;
Number(obj) : converteşte obj la number;
String(obj) : converteşte obj la string;
escape/unescape(str) : folosite pentru codificare/decodificare stringuri.
document.write(variabilă)
Putem intercala cod JavaScript cu cod HTML. În document.write se pot utiliza etichetele HTML
cu condiţia de a fi scrise între ghilimele. Dacă în cadrl ghilimelelor amen nevoie de alte ghilimele
atunci pentru cele din urmă se utilizeazo apostrof. De exemplu, putem afişa texte scrise cu fonturi
bold, respectiv italic ca în exemplu alăturat.
<html> <head>
<title> document.write </title>
</head>
<body>
<script type=‘‘text/javascript”>
document.write(”<b>bold</b> <i>italic</i>‘‘);
</script>
</body> </html>
Instrucţiuni JavaScript Instrucţiunile JavaScript pot fi terminate să nu cu caracterul ;. Acest caracter este obligatoriu doar
atunci când sunt mai multe instrucţiuni pe acelaşi rând. Instrucţiunea de atribuire a fost utilizată şi în exemple anterioare şi este cea cunoscută din C şi Java.
Instrucţiunea IF este o instrucţiunea condiţională şi foloseşte cuvintele cheie if şi else având următoarea
sintaxă:
Să se sciteasca numele şi parola unui utilizator iar în funcţie de acestea să se afişeze un anumit
mesaj (figura 2.1).
<script type=‘‘text/javascript”>
nume=prompt(”Introduceti numele”,””);
parola=prompt(”Introduceti parola”,””) ;
n_valid=‘‘student” ;
p_valid=‘‘utm” ;
if((nume==n_valid)&&(parola==p_valid))
{
alert(”Date corecte!”) ;
document.write(”Bun venit pe pagina studentilor de la facultatea...”) ;
}
else
{
alert(”Date incorecte!”) ;
document.write(”Apasati F5 şi mai incercati !!!...”) ;
}
</script>
if (condiţie)
{
instrucţiuni pentru condiţie adevărată
}
else
{
instrucţiuni pentru condiţie falsă
}
Figura 2.1
Instrucţiuni de ciclare Adeseori se doreşte executarea repetată a mai multor instrucţiuni. Acest lucru este posibil, cu ajutorul
instrucţiunilor de ciclare. În JavaScript există instrucţiunile de ciclare: for, while şi do...while. Sintaxa
instrucţiunii for este:
Oricare dintre cele patru secţiuni (de iniţializare, condiţia, de incrementare sau corpul) poate lipsi.
Sintaxa instrucţiunii while este:
- În cazul instrucţiunii while poate lipsi corpul ciclului, prezenţa condiţiei fiind obligatorie.
Exemplu:
Instrucţiunea SWITCH Poate fi folosită pentru alegerea unei opţiuni din mai multe opţiuni.
Sintaxa instrucţiunii este:
for (iniţializare; condiţie; incrementare)
{
corpul ciclului;
}
while (condiţie)
{
corpul ciclului
}
<script type=‘‘text/javascript”>
i=””;
while(i!==‘‘student”)
{
i=prompt(”Introduceti parola”,””);
}
document.write(”Password accepted”);
</script>
Instrucţiunile break şi continue Instrucţiunea break permite ieşirea forţată dintr-o instrucţiune de ciclare. În momentul în care
interpretorul JavaScript întâlneşte o astfel de instrucţiune, el întrerupe execuţia ciclului în
interiorul căruia se află aceasta.
Instrucţiunea continue permite saltul peste anumite instrucţiuni din corpul ciclului care nu mai
trebuie executate în anumite condiţii. În cazul unui ciclu for, se trece în mod automat, la ultimul
pas al execuţiei ciclului, în timp ce în cazul unui ciclu while se trece la primul pas.
Folosirea tablourilor de elemente în JS Un tablou de elemente (şir) este o structură complexă care înglobează mai multe variabile de acelaşi tip
sub un nume. Un şir de elemente are o anumită dimensiune, are un anumit număr de elemente, fiecare
element având o valoare şi este identificat prin poziţia în cadrul şirului.
Un şir se defineşte prin: numeşir = new Array().
2.4 Funcţii şi evenimente în Java Script
O funcţie este văzută ca un bloc de instrucţiuni identificat printr-un nume care poate primi
anumite argumente şi întoarce o valoare. Sintaxa unei funcţii este:
switch (expresie)
{
case eticheta : instrucţiune; break;
case eticheta: instrucţiune; break;
...
default : instrucţiune;
}
Exemplu: <script type=‘‘text/javascript”>
opt=eval(prompt(”Introduceti nr zilei”,”” ))
switch (opt)
{
case 1: zi=‘‘luni”;break
case 2: zi=‘‘marti”;break
case 3: zi=‘‘miercuri”;break
case 4: zi=‘‘joi”;break
case 5: zi=‘‘vineri”;break
case 6: zi=‘‘sambata”;break
case 7: zi=‘‘duminica”;break
default: zi=‘‘Introduceti un nr între 1 şi 7”
}
document.write(zi)
</script>
function numefuncţie (listă parametri formali)
{
instrucţiuni;
return (valoare)
}
Apelul funcţiei se realizează numefuncţie(parametri efectivi). Funcţiile sunt definite de obicei
în zona HEAD şi sunt apelate apoi, ori de câte ori este nevoie, în BODY.
F(x)=x+1 unde x – parametru formal,
F(2)=3 unde 2 – parametru efectiv.
Se poate apela x=suma (1,1).
Exemplu: funcţia titlu (parametru), să afişeze parametru aceasteia cu font albastru de mărime 5
(figura 2.2).
<script type=‘‘text/javascript”>
function titlu (a)
{document.write(“<font color=red size=7>‘‘+a+”</font>‘‘)}
x=prompt(“Introduceti titlul”,””);titlu(x);
</script>
Figura 2.2 Text scris prin aplelul unei funcţii
Funcţiile pot fi definite şi fără parametri şi pot returna sau nu o valoare.
<script type=‘‘text/javascript”>
function titlu ()
{document.write(”<font color=red size=7>‘‘+a+”</font>‘‘);}
a=prompt(”Introduceti titlul”,””);
titlu();</script>
Utilizarea casetelor de validate
Conţinutul enei casete de validare se preia cu propietatea value care se aplica casetei astfel:
numecaseta.value. Daca caseta face parte dintr-un formular atunci continutul casetei se
accesează: numeformular.numecaseta.value.
Să se preia dintr-un formular numele şi parola, să se verifice şi să se afişeze un mesaj într-o altă
casetă a formularului (figura 2.3). <html>
function suma (a,b) { s=a+b;return s; }
<head>
<title> Formular butoane java – casete text </title>
<script>
function afisare(){
// pot să pun varibile formale
a=form1.t1.value;
b=form1.t2.value;
if (a==”123” && b==”abc”) form1.t3.value=”Corect!”;
else
if(a==”123” && b!=”abc”) form1.t3.value=”parola incorecta!”;
else
if(a!=”123” && b==”abc”) form1.t3.value=”user incorrect!”;
else
form1.t3.value=”user incorrect! şi parola incorecta”;
}
function sterge(x)
{x.value=””}
// “\n” trece la randul urmator
// sintaxa if: if(conditie) executa o secventa s1; else executa secventa s2
// observatie: daca conditia are 2 elem se grupeaza inte {}
// secventa s2 poate să lipseasca şi atunci se reduce la if(conditie) S1;
</script>
</head>
<body><form name=”form1”>
<h1><center> casete de text</center></h1>
User: <input type=”text” name=”t1” value=”” onclick=”sterge(t1)” size=”40” >
<br><br><br>
parola: <input type=”password” name=”t2” value=”” onclick=”sterge(t2)”>
<br><br>
<br>mesaj: <input type=”text” name=”t3” value=”” onclick=”sterge(t3)” size=”40”>
<input type=”button” name=”b1” value=”testare” onclick=”afisare()”>
</form></BODY>
</html>
Figura 2.3. Testare user şi parola
Utilizarea casetelor de tip checkbox
Pentru o casetă de tip checkbox starea acesteia se preia cu proprietate checked.
Utilizarea butoanelor de tip radio
Dacă butoanele de tip radio fac parte din acelaşi grup, atunci ele sunt gestionate într-un vector,
astfel încât primul element este pe poziţia zero. Proprietatea utilizată pentru a testa starea
elementului (dacă a fost selectat sau nu) este tot checked, asemănător ca la casetele de tip
ckeckbox.
Exemplu <html>
<head>
<title> butoane radio </title>
<script>
function test(x){
if(x[0].checked) alert ("Ati selectat culoarea "+ x[0].value);
if(x[1].checked) alert ("Ati selectat culoarea "+ x[1].value);
if(x[2].checked) alert ("Ati selectat culoarea "+ x[2].value);
}
</script>
</head><body>
Utilizarea listelor de selecţie
Propietatea utilizată pentru a testa dacă un element dintr-o lista de selecţie a fost selectat este
selected. Valoarea ataşată atributului value este preluată cu .value, la fel ca la casetele de tip text.
Exemplu: <html>
<head>
<title> </title>
<script>
function lista(x)
{
for(i=0;i<6;i++)
if (x[i].selected) alert("ati selectat produsul "+ x[i].value)
}
</script>
</head>
<body>
<h1><center> liste selectie </center></h1>
<form>
<SELECT name="s" size="3">
<option value="test 11">test 11</option>
<option value="test 12">test 12</option>
<option value="test 13">test 13</option>
<option value="test 14">test 14</option>
<option value="test 15">test 15</option>
<option value="test 16">test 16</option>
</select>
<br><br><br>
<input type="button" name="b1" value="afiseaza" onclick="lista(s)">
</form></BODY></html
Evenimente
Limbajul JavaScript este bazat pe evenimente, acestea fiind folosite pentru a controla
interacţiunea dintre utilizator şi aplicaţie. Programele convenţionale operează într-o manieră
diferită, codul acestora fiind executat secvenţial. Pentru a specifica instrucţiunile JavaScript care
trebuie executate la apariţia unui eveniment, limbajul HTML pune la dispoziţie anumite atribute
pentru diferite marcaje, atribute care au ca valori instrucţiuni JavaScript (de obicei apeluri de
funcţii). Cele mai multe evenimente sunt legate de acţiuni ale mouse-ului ca de exemplu: un clic
(poate fi tratat cu atributul onclick), mouse deasupra cu atributul (onmouseover), mouse în afară
cu atributul (onmouseout) etc. Pentru fiecare astfel de eveniment se pot defini handlere de
evenimente care sunt functii javascript sau secvente de instructiuni care se vor executa atunci
cand evenimentul respectiv are loc.
Evenimentele şi handlerele de evenimente care se pot folosi sunt urmatoarele:
Eveniment Handler de ev. are loc pentru se aplică
Abort OnAbort oprirea incarcarii
unei imagini
Image
Blur OnBlur pierderea focusului Window şi elem. ale
obiectului Form
Change OnChange schimbarea valorii
unui element
Text, TextArea, Select
Click OnClick utilizatorul face
click
Button, Checkbox, Link,
Radio, Submit, Reset
DragDrop OnDragDrop plasarea unui obiect
în fereastra
browserului
Window
Error OnErrorFocus eroare la încarcarea
obiectului
Image, Window
Focus OnFocus elementul capata
focus
Window şi elem. ale
obiectului Form
KeyDown OnKeyDown apasarea unei taste Document, Image, Link,
TextArea
KeyPress OnKeyPress apasarea sau
mentinerea apasata a
unei taste
Document, Image, Link,
TextArea
KeyUp OnKeyUp eliberarea unei taste Document, Image, Link,
TextArea
Load OnLoad incarcarea paginii in
navigator
Document
MouseDown OnMouseDown apasarea butonului
de mouse
Document, Button, Link
MouseMove OnMouseMove mutarea cursorului Nici unui obiect
MouseOut OnMouseOut mutarea cursorului
de mouse in afara
obiectului
Area, Link
MouseOver OnMouseOver mutarea cursorului
peste un link
Link
MouseUp OnMouseUp eliberarea butonului
de mouse
Document, Button, Link
Move OnMove deplasarea ferestrei Window
Reset OnReset click pe butonul
reset
Form
Resize OnResize redimensionarea
ferestrei
Window
Select onSelect selectarea unui
elem. al campului
Text, TextArea
Submit onSubmit apasarea pe submit Form
Unload onUnload parasirea paginii Document
În afara evenimentelor generate de utilizator pot fi tratate şi evenimente ce se produc automat. Apar
evenimente ca:
load – încărcarea paginii – poate fi gestionat cu atributul onload
unload – închiderea documentului - poate fi gestionat cu atributul onunload
Ambele atribute aparţin marcajului BODY.
<script type=‘‘text/javascript”>
a=‘‘Bun venit pe pagina mea”; b=‘‘Multumesc!...Good Bye !”
function f(x)
{
alert(x)
}
</script>
<body onload=‘‘f(a)” onunload=‘‘f(b)”>
2.5 Obiecte în Java Script
Un obiect trebuie înţeles ca o structură ce reuneşte mai multe funcţii şi variabile sub acelaşi nume.
Funcţiile unui obiect reprezintă metode iar variabilele obiectului sunt proprietăţi.
Obiectele permit reutilizarea unui cod deja existent şi sunt folosite în mai toate limbajele de programare
orientate pe obiect. Java Script este un limbaj bazat pe obiecte şi pune la dispoziţie un set predefinit de
obiecte. Fiecare obiect este identificat prin nume.
O proprietate a obiectului este apelată prin numeobiect.proprietate (document.bgColor = ‘‘red”). O
metodă este adresată prin numeobiect.metodă(argument). Obiectele JavaScript sunt ierarhizate. Un
obiect poate fi derivat, inclus în cadrul unui alt obiect. Ierarhia de obiecte JS are 4 ramuri principale,
reprezenţate de obiectele: window, navigator, screen, language. Din window derivează: frame,
document, location, history, din document derivă image, form, ş.a.m.d.Pe lângă acestea, JS pune la
dispoziţie obiecte predefinite referitoare în general la tipuri de date: String, Math, Date.
Obiectul String
Încapsulează un şir de caractere. Este creat automat atunci când unei variabile i se asociază o valoare de
tip şir de caractere.
Dintre metodele lui String întâlnim:
Metoda Efect
anchor() returneaza un sir ca şi "anchor"
big() returneaza un sir cu text mare
blink() returneaza un sir care clipeste
bold() returneaza un sir cu litere ingrosate
charAt() returneaza un caracter de la pozitia care
este specificata
charCodeAt() returneaza codul ascii al unui caracter de
la o pozitie specificata
concat() returneaza doua siruri concatenate
fixed() returneaza un sir cu caractere tip
fontcolor() returneaza un sir cu o culoare specificata
fontsize() returneaza un sir cu litere de o anume
marime
fromCharCode() returneaza valoare unicode a unui
caracater
indexOf() returneaza pozitia primei aparitii a unui
subsir intr-un sir
italics() returneaza un sir in italic (scris aplecat)
lastIndexOf() returneaza pozitia primei aparitii a unui
subsir in un sir
link() returneaza un sir ca hyperlink
match() similar cu indexof şi lastindexof, dar
Metoda Efect
aceasta metodă returneaza sirul specificat
sir, sau "null", in locul unor valori
numerice
replace() inlocuieste unele caractere specificate cu
altele noi specificate.
search() returneaza un numar intreg daca sirul
contine caracterele specificate
slice() returneaza un sir incepand de la pozitia
index specificata
small() returneaza un sir cu caractere mai mici
split() imparte un sir in mai multe siruri, in
functie de caracterele specificate
strike() returneaza un sir taiat cu o linie la mijloc
sub() returneaza un sir ca indice
substr() returneaza un subsir specificat
toLowerCase() converteste un sir in litere mici
toUpperCase() converteste un sir in litere mari
Proprietatea acestui obiect string este length care returneaza numarul de caractere dintr-un sir.
Obiectul Date
Obiectul Date este folosit pentru a obţine informaţii referitoare la ceasul sistem de pe calculatorul
vizitatorului paginii Web. Prin intermediul acestui obiect pot fi determinate data şi ora curentă, pot fi
efectuate diferite operaţii cu date calendaristice sau momente ale zilei sau poate fi controlat modul în care
este afişată pagina Web în funcţie de informaţiile furnizate de metodele acestui obiect.
Pentru a crea un obiect care să conţină data şi ora curentă secvenţa JavaScript corespunzătoare este
data=new Date().
Metodele obiectelor de tip sunt grupate în trei categorii: metode pentru preluare de informaţii, metode
pentru setarea anumitor caracteristici şi metode pentru conversie.
Principalele metode ale obiectului Date() sunt:
Date() returneaza un obiect Date
getDate() returneaza data (ziua) din luna (între 131)
getDay() returneaza ziua dintr un obiect Date (între 0 şi 6;
0=Duminica, 1=Luni, etc.)
getMonth() returneaza luna dintr un obiect Date
getFullYear() returneaza anul cu 4 cifre
getYear() returneaza anul dintr un obiect Date
getHours() returneaza ora
getMinutes() returneaza minutele
getSeconds() returneaza secunda
setTimeout(”funcţie”,timp)
timp se exprimă în ms
Obiectul Window Este plasat la cel mai înalt nivel, fiind părintele tuturor obiectelor dintr-o pagină.
Metode fundamentale:
open(), close()
alert(), prompt(), confirm()
blur(), focus()
setTimeout()
Obiectul window este important pentru gestionarea ferestrelor în care sunt încărcate documentele html.
Folosind metodele open() şi close() putem deschide ferestre, putem încărca anumite documente în
ferestrele respective şi le putem stabili anumite proprietăţi.
Deschiderea unei ferestre
window.open (”URL”, ‘‘nume”,”opţiuni”)
- URL indică adresa documentului care va fi încărcat în fereastra respectivă
- nume poate fi folosit pentru a referi fereastra respectivă cu ajutorul atributului target
- opţiuni reprezintă o listă de elemente pentru stabilirea aspectului ferestrei
În cadrul scriptului fereastra deschisă poate fi identificată prin variabilă:
f=window.open ()
Are sens:
f.document.write() – scrie în fereastra f
f.document.title() – stabileşte titlul ferestrei
f.document.bgColor() – stabileşte culoare de fond a documentului din fereastra deschisă.
Metodă open permite specificarea unor parametri legaţi de aspectul ferestrei deschise. Aceştia se introduc
separaţi prin virgulă în cadrul secţiunii opţiuni din construcţia metodei open:
Închiderea ferestrelor se poate realiza prin metodă close()
Poate fi apelată prin:
window.close() - pentru fereasta curentă
f.close() - pentru un obiect de tip fereastra
Metodă moveTo(i,j) mută o fereastră cu i pixeli spre dreapta şi j pixeli în jos.
Obiectul document Este derivat din obiectul window şi este folosit ca metodă de acces la toate elementele html.
Proprietăţile obiectului document setează în primul rând proprietăţile şi atributele html incluse în marcajul
HEAD sau în marcajul BODY.
Principalele proprietăţi sunt:
<script type=‘‘text/javascript”>
function fereastra()
{
f=window.open()
f.document.write(”<H1>RECLAMA</H1>‘‘)
f.document.bgColor(”cyan”)
}
</script>
<body onload=fereastra()>
- width - lăţimea în pixeli a suprafeţei ferestrei
- height - înălţimea în pixeli a suprafeţei ferestrei
- toolbar = yes/no - afişează sau nu bara de instrumente
- menubar = yes/no - afişează sau nu bara de meniuri
- scrollbars = yes/no - afişează sau nu bara de scroll
- left = nr de pixeli faţă de marginea din stânga a ecranului
- top = nr de pixeli faţă de marginea sus a ecranului
document.title = text în bara de titlu
document.bgColor = culoarea fundalului
document.fgColor = culoarea textului
document.alinkColor = culoarea legăturilor active
document.vlinkColor = culoarea legăturilor vizitate
document.linkColor = culoarea legăturilor nevizitate
document.cookie = fisier cookie asociat cu documentul
Metodele obiectului document permit generarea paginilor html în mod dinamic. Principalele
metode sunt:
Gestionarea cadrelor Atunci când introducem cadre este creat automat un obiect parent, care include un şir de obiecte, fiecare
înglobând un cadru din interiorul ferestrei:
parent.frames[0] – referă primul cadru
parent.frames[1] – referă al doilea cadru s.a.m.d.
De exemplu, parent.frames[0].document.write() - scrie în primul cadru.
Dacă atunci când au fost introduse cadrele acestea au primit şi un nume putem referi un cadru prin
construcţia: parent.numecadru
De exemplu, parent.cadru.document.write() - scrie în cadrul cu numele ‘‘cadru”.
Obiectul location
Încapsulează adresa URL a paginii curente. Permite deplasarea la o altă adresă URL sau permite
extragerea unor elemente din cadrul URL curent. Cea mai folosită proprietate este href - specifică
întreaga adresă URL De exemplu, încărcarea unei alte pagini web se poate face prin construcţia:
window.location.href = ‘‘URL”
Exemplu de buton cu funcţie de legătură:
<input type=button value=‘‘Student”
onclick=‘‘window.location.href=’http://www.microsoft.com’”>
Încărcarea unui fişier într-un cadru se poate face prin parent.cadru.location.href=‘‘URL”
Construirea unui banner La încărcarea unui pagini se deschide o fereastră nouă în care, din 2 în 2 secunde se succed 3 imagini.
<script type=‘‘text/javascript”>
imagini=new Array();
imagini[0]=‘‘x.gif”;
imagini[1]=‘‘y.gif”;
imagini[2]=‘‘z.gif”;
function deschide() {
close() - inchide fluxul datelor de iesire spre document
contextual() - permite să aplicam in mod selectiv un stil unui element HTML care apare
într-un anumit context specific
getSelection() - intoarce textul selectat
handleEvent() - apeleaza handlerul pentru evenimentul specificat
open() - deschide fluxul datelor de iesire spre document
write() - adauga text in document
writeln() - adauga text şi un caracter linie noua in document (textul pe linia lui)
f=window.open(”‘‘,””,”width=200, height=100, scrollbars=no, menubar=no,
toolbar=no”) }
i=-1;
function banner()
{
i++;
f.location.href=imagini[i]
if(i==2)
i=-1;
setTimeout(”banner()”,2000)
}
</script>
<body onload=‘‘deschide();banner()”>
Obiectul Image
Cuprinde proprietăţile şi metodele necesare pentru lucrul cu imagini. Se creează cu new Image()
poza=new Image()
Proprietăţi: poza.src=sursa imaginii; poza.width=lăţimea imaginii în pixeli;
poza.height=înălţimea imaginii în pixeli; poza.border=grosimea chenarului în pixeli;
poza.name=numele imaginii;
La introducerea imaginilor într-o pagină web se creează în mod automat un şir de obiecte
imagine. Fiecărui obiect de tip imagine i se pot aplica toate proprietăţile imaginilor. Este
identificat prin document.images[i], unde i este numărul de ordine al imaginii din cadrul
documentului.
Realizarea unui efect RollOver Un efect RollOver înseamnă schimbarea fişierului sursă al imaginii de fiecare dată când se plasează
mouse-ul deasupra imaginii. Se revine la imaginea iniţială atunci când mouse-ul este scos de pe imagine.
Exemplu: Pagină care afişează 2 imagini. Când se plasează mouse-ul pe o imagine aceasta să
apară cu chenar iar când se executa clic să apară mai jos redimensioantă: <table>
<tr><td>
<img src=‘‘x.gif” width=50 height=40
onmouseover=document.images[0].border=2
onmouseout=document.images[0].border=0
onclick=‘‘document.images[2].src='x.gif'‘‘>
<td><img src=‘‘y.gif” width=50 height=40
onmouseover=document.images[1].border=2
onmouseout=document.images[1].border=0
onclick=‘‘document.images[2].src='y.GIF'‘‘>
</table>
<br><br><br><br>
<img src=‘‘‘‘ width=200 height=100 alt=‘‘Afiseaza poza”>
Intrebari de control
Explicati motodele obiectului document;
Explicati instructiunile de ciclare;
Funcţii şi evenimente în Java Script
Explicati evenimentele care se folosesc in JavaScript
Enumerati principalele metode ale obiectului string, window si date.
Teme propuse
Să se introducă 3 numere de la tastatură şi să se afişeze în pagină unul după celălalt;
Să se realizeze un buton care schimbă culorile fundalului unei pagini.
Script care să deschidă o fereastră ce se deplasează în partea de sus pâna la mijlocul
ecranului. Un buton va închide fereastra.
Script ce derulează în pagină trei imagini, din 3 în 3 secunde
UUNNIITTAATTEEAA DDEE IINNVVAATTAARREE IIIIII..
PPHHPP şşii MMyySSQQLL
Aceasta unitate are ca scop cunoasterea limbajului PHP, care este un acronim ce provine
din "Hypertext Preprocessor" care este un limbaj de scripting, realizat şi distribuit în sistem Open
Source, special realizat pentru a dezvolta aplicaţii web, prin integrarea codului PHP în documente
HTML. Scopul principal al limbajului este acela de a scrie rapid pagini web dinamice şi oferă
suport pentru manipularea bazelor de date de tip SQL (dBase, Informix, MySQL, mSQL, Oracle,
PostgreSQL, Solid, Sybase, ODBC etc.) cât şi acces la sisteme hipermedia.
Mater
ialul
trebui
e
parcur
s în
ordine
a sa
fireas
că prezentată în continuare, inclusiv în zona referitoare la aplicatii. Se recomandă testarea
functiilor PHP si instructiunilor MySql cat si consultarea Internetului pentru detalii si
informatii suplimentare
(http://www.wampserver.com/en/,
http://www.mysql.com/,
http://www.apache.org/,
http://www.php.net/).
Timpul minim pe care trebuie să-l acordati acestui modul este de 8 ore.
Cuprins:
3. PHP şi MySQL
3.1. Modelul client-server.Pagini Web interactive (dinamice)
3.2. Tipuri de variabile utilizate în limbajul PHP
3.3. Crearea scripturilor PHP
3.4. Folosirea PHP-ului cu formulare HTML
3.5. Funcţii în PHP
3.6. Programarea orientată pe obiecte (POO) în PHP
3.7 Utilizarea MySQL
Cuvinte cheie: PHP, MySQL, apache, server web.
3.1 Modelul client-server. Pagini web interactive (dinamice)
PHP suportă încărcarea fişierelor de pe calculatorul client, operaţie cunoscută sub numele de
upload (standard propus de E. Nebel şi L. Masinter de la Xerox) şi oferă suport pentru cookies
După parcurgerea si însusirea acestei unitati, studentul va fi capabil:
- sa construiasca inteleaga modelul client-server;
- sa utilizeze variabilele PHP;
- sa creze scripturi PHP;
- sa utilizeze functiile specifice lui MySql in PHP;
- sa realizeze o aplicatie dinamica
(mecanism de stocare a datelor în navigatorul client pentru identificarea utilizatorilor, propus de
Netscape).
Limbajul PHP are deasemenea suport pentru diverse servicii server, utilizând protocoale
precum IMAP, SNMP, NNTP, POP3 şi HTTP.
Paginile HTML sunt de tip “static”, adică informaţiile prezentate în aceste pagini sunt identice
pentru toţi vizitatorii, fiind simple pagini de prezentare. Web-ul este însă dinamic, adică pentru
unel pagini este nevoie să fie actualizate “în timp real”. Dacă doi vizitatori, aflaţi în locuri
diferite, accesează acelaşi site de joburi în acelaşi timpasrefel încât unul doreşte afişarea joburilor
din domeniul economic, iar al doilea doreşte afişarea joburilor din domeniul securităţii şi sănătăţii
în muncă, atunci serverul web va afişa pentru fiecare vizitator al site-ului pagina corespunzătoare
cerinţelor specificate. Acest lucru este posibil datorită tehnologiilor de tip client-server. Acest
tip de tehnologii presupun stocarea datelor pe un server web şi apoi afişarea acestora la cererea
fiecărui vizitator, în forma dorită de acesta.
Un server web reprezint un calculator conectat permanent la Internet, care trimite către client
(care este un calculator pe care rulează un browser) pagini în format HTML. La un server se pot
conecta simultan mai mulţi clienţi, care pot avea acces la aceleaşi informaţii. Diferenţa este
esenţială comparativ cu paginile simple HTML, care sunt afişate în browserul vizitatorului aşa
cum au fost construite. Web-ul este dinamic, iar programele care fac posibil acest lucru sunt
numite scripturi CGI sau scripturi server-side, întrucât acestea folosesc o interfaţă standard
numită Common Gateway. Scripturile sunt scrise în limbajul C sau cu ajutorul unui limbaj
specializat, numit şi limbaj de scripting (cele mai utilizate fiind PHP, ASP şi Perl) şi sunt stocate
pe serverul web pe care şi rulează.
Diferenţa dintre limbaj de scripting pe partea de client (ex. JavaScript) şi unul server-side este
esenţială doarece JavaScript rulează în browserul clientului, pe când un script server-side rulează
pe server, având acces la unele informaţii stocate pe server la care un script client-side nu are
acces. Un exemplu sugestiv este un contor de pagina web. De câte ori cineva accesează pagina,
scriptul server-side va contoriza vizitarea paginii într-o bază de date stocată pe server.
Într-o sesiune client-server care conţine şi interogarea unei baze de date au loc următoarele etape:
În practică pentru a crea aplicaţii web interactive, avem nevoie de:
introducerea adresei în bara de adrese a browserului;
serverul web primeşte cererea şi determină execuţia unui script de pe server;
scriptul extrage unele date dintr-o bază de date;
datele extrase sunt prelucrate şi convertite în format HTML;
pagina în format HTML este transmisă serverului web;
serverul web transmite pagina browserului care a trimis cererea;
browserul afişează informaţiile utilizatorului.
un server web (software),
un limbaj de scripting pe partea de server,
un server de baze de date.
Dacă se lucrează local, atunci vizualizarea (testarea aplicaţiilor php) se realizeaza in cadrul unui
browser, cu condiţia ca, în bara de adrese, să se editeze http://localhost/eventual numele
folderului ce contine sursele php .
3.2 Tipuri de variabile utilizate în limbajul PHP
PHP este un limbaj de programare la fel ca şi BASIC, Pascal, C, C++, Visual Basic, Java etc şi
are caracteristicile specifice unui limbaj de programare. În cadrul acestuia se lucrează cu variabile
care reprezintă zonă de memorie, căreia i se atribuie un nume pentru a putea fi recunoscută şi
apelată ulterior. Variabilele se compun din simbolul $ urmat de numele variabilei $variabilăphp.
Numele variabilei poate începe cu o literă sau un underscore, urmat de litere, cifre sau caractere
underscore. Principalele tipuri de date sunt cele din tabelul următor.
Tipuri Scalare
Integer – este o valoare din mulţimea nuinformaticalor întregi
Float - o astfel de variabilă poate fi specificată fie prin forma
zecimală, fie prin cea ştiinţifică (cu exponent)
String - este un şir de caractere şi poate fi specificat în 2 moduri:
o folosind ghilimele simple ‘’
o folosing ghilimele duble “”
Tipuri compuse
Array
Object
Tipuri speciale
Resource - variabilă de tip Resource este o variabilă specială,
folosită pentru păstrarea unor referinţe către anumite resurse externe
NULL - valoarea specială NULL este atribuită oricărei variabile
care nu a fost iniţializată. Aceasta este singura valoare pe care o pot
avea variabilele de tip NULL. Se consideră că o variabilă este de tip
NULL în următoarele situaţii: i s-a atribuit constanta NULL; nu a
fost iniţializată; a fost deziniţializată (prin intermediul funcţiei
unset() ).
Aceste elemente se pot descărca gratuit din Internet de la adresele:
serverul web Apache ( http://www.apache.org/ ) având variante Apache pentru Linux
cât şi pentru Windows şi este gratis, stabil şi rapid.
limbajul PHP ( http://www.php.net/ ) este folosit de peste 45% din site-urile interactive
şi este gratis, uşor de învăţat (sintaxa asemănătoare cu C), oferă foarte multe funcţii,
oferă suport pentru multe tipuri de baze de date (nici un alt limbaj nu oferă asemenea
suport).
serverul de baze de date MySQL ( http://www.mysql.com/) este gratis şi rapid .
Combinaţia PHP şi MySQL este folosită preponderent.
(a) Tipul
BOO
LEA
N
False - se poate converti o variabilă de orice tip la tipul Boolean.
Valorile care în urma conversiei se transformă în FALSE sunt:
Nr întreg 0
Nr real 0.0
Şirul vid
Şirul “0”
Un vector fără nici un element
Un obiect fără nici o variabilă membru
O variabilă de tipul NULL
O variabilă nedefinită
True - orice altă valoare se converteşte în TRUE
Tipul ARRAY (vectori) pot fi considerate mulţimi formate din chei. Fiecărei chei i se ataşează o
valoare. Acest tip este optimizat, astfel încât să poată fi folosit în locul următoarelor structuri de
date: liste, tabele de dispersie, colecţii, stive, cozi etc. Vectori pot fi :
o vectori numerici
o vectori asociativi
o vectori multidimensionali
VARIABILE GLOBALE sunt disponibile în orice zona a codului sursă. Exemple:
$GLOBALS cuprinde referinţe spre orice variabilă globală care este accesibilă
scriptului PHP curent;
$_SERVER conţine o serie de variabile ale căror valori sunt setate de server-ul
web. (majoritatea depind de mediul de execuţie al script-ului curent);
$_GET şi
$_POST
sunt variabile array globale. $_GET poate fi folosită pentru a trimite
variabile cu valori prin intermediul link-urilor. $_POST poate fi
folosită pentru a trimite variabile cu valori prin intermediul
formularelor.
$_COOKIE conţine valorile variabilelor care cuprind informaţii referitoare la
cookie-urile păstrate pe calculatorul utilizatorului ce accesează pagina
web.
$_FILES conţine variabile primite de script prin intermediul încărcărilor de
fişiere prin metoda post.
$_ENV conţine variabile disponibile prin intermediul mediului în care este
executat.
$_REQUEST variabile disponibile prin intermediul oricărui tip de mecanism cu
ajutorul căruia utilizatorul poate introduce date.
$_SESSION variabile care corespund sesiunii curente a script-ului.
Article IV.
33..33 CCrreeaarreeaa ssccrriippttuurriilloorr PPHHPP
Fiecare script PHP arata ca in figurile de mai jos si indică serverului că textul cuprins între
acestea este format din instrucţiuni PHP.
<?php
// continutul scriptului
?>
sau, echivalent:
Scripturile PHP execută următoarele de operaţii elementare:
- preluarea datelor de la utilizator,
- prelucrarea acestor date,
- obţinerea accesului la datele stocate pe server,
- prelucrarea datelor stocate pe server şi
- afişarea datelor.
Scripturile PHP sunt formate din instrucţiuni iar cea mai simplă instrucţiune PHP este cea de
afişare a unui text în browser.
echo “Informaţii afişate în browser”;
Tag-urile HTML se introduc în codul PHP astfel:
echo “<b> <i> Introducerea codului HTML într-un script </i> </b>”;
Un comentariu se introduce într-un script PHP cu ajutorul marcajului // (când comentariul este
scris pe o singură linie) sau /* conţinutul comentariului */ (atunci când comentariul este scris pe
mai multe linii).
<?php
// comentariu pe o linie
//continutul scriptului
?>
<?php
/* comentariu pe mai
multe linii */
// continutul scriptului
?>
Article V.
Article VI.
Article VII. Structuri de control întâlnite în PHP sunt:
Alternative
o IF
o Else
o Elseif
o Switch
Repetitive
o While
o For
<?
// continutul scriptului
?>
o Do while
Break
Continue
Declare
Instrucţiunea continue este utilizată într-o buclă iar execuţia iteraţiei curente este întrerupă şi se
trece la execuţia iteraţiei următoare. Instrucţiunea continue acceptă un argument numeric opţional
care va indică câte bucle imbricate vor fi ignorate.
Instrucţiunea foreach – versiunea PHP4 (nu şi PHP3) dispune de comanda foreach, ca Perl sau
alte limbaje. Instrucţiunea oferă un mod simplu de a parcurge un tablou.
33..44 FFoolloossiirreeaa PPHHPP--uulluuii ccuu ffoorrmmuullaarree HHTTMMLL
Caracterizarea formularelor HTML
Permit introducerea datelor de către vizitatorul paginii web.
Crearea se face începând cu matematicachea de etichete <form>…</form>.
Atributele lui <form> sunt: action şi method.
Action precizează ce se va întâmpla cu datele introduse în formular. În general i se asociază
adresa unui script aflat pe server (în cazul nostru numele fişierului PHP) care va prelucra datele.
Method se referă la modul în care vor fi trimise datele spre scriptul de pe server. Valorile
posibile sunt: GET şi POST.
GET permite trimiterea cantităţi restrânse de date prin adăugarea lor la URL
POST permite trimiterea cantităţilor mari de date iar acestea sunt expediate separat.
O regulă empirică privind alegerea între GET şi POST ar fi următoare: mulţi programatori
utilizează GET pentru formularele care execută o căutare sau interogare şi POST pentru
formularele care actualizează o bază de date sau un fişier. Astfel, datele trimise prin metoda GET
pot fi vizualizate de catre utilizator.
Pentru a realiza un formular se utilizează eticheta FORM exemplificată în capitolul HTML:
<FORM name =”numeformular” METHOD=”metoda” ACTION=”url” >
Atributul ACTION specifică adresa URL a scriptului PHP care prelucrează datele transmise prin
intermediul formularului. Adresa URL poate fi o adresa completă, care include protocolul,
numele gazdei şi calea de acces, respectiv o adresă parţială, care specifică o locaţie relativă la
locaţia paginii curente.
Exemplu: <FORM method=”POST” action=”test1.php”>
Pricipalele controale care pot fi incluse în formular (vezi capitolul de HTML) cât şi principalele
evenimente ataşate acestora sunt:
Listă controale
textbox (text), password textbox (password), butoane radio (radio), casete de validare
(checkbox), butoane (button, submit, reset), lista derulantă (select), editbox (textarea), caseta
de fişier (file).
Listă evenimente
onclick, ondblclick, onmousedown, onmouseup, onmouseover onmousemove, onmouseout,
onkeypress, onkeydown, onkeyup
Section 7.01 Prin intermediul formularului se trimite la server un fişier astfel:
<input type=“file” accept=“tip_mime” name=“nume” value=“text”>
unde:
accept este un atribut care specifică tipul fişierului,
name este numele casetei,
value se foloseşte pentru un nume prestabilit de fişier,
MIME (Multipurpose Internet Mail Extensions).
În eticheta form trebuie adăugat şi atributul enctype=“multipart/form-data ”.
Formatele cele mai frecvent folosite pt MIME sunt:
TIP MIME TIP DATE EXTENSII DE
FIŞIER
application/msexcel Microsoft Excel xls
application/msword Microsoft Word doc, dot
application/octet-stream Binara exe
application/pdf Adobe Acrobat pdf
application/ppt Microsoft PowerPoint ppt
application/zip Date comprimate în format ZIP zip
audio/midi Musical Instrument Digital Interface
(MIDI)
mid,midi
audio/x-wav Windows Audio Format (WAV) wav
image/gif Compuserve Graphics Interchange
Format (GIF)
gif
image/jpeg Joint Photographics Expert Group (JPEG) jpeg, jpg, jpe
image/TIFF Tagged Image Format (TIF) tif, tiff
text/HTML HTML htm, html
text/plain Text simplu txt
text/richtext Rich Text Format (RTF) rtf
video/mpeg Secventa video mpg, mpv, mpe,
mpeg
video/quicktime Secventa video qt, mov
video/x-msvideo Secventa video avi
În general prelucrarea datelor transmise la server se face într-un fişier distinct decât cel care
conţine formularul, caz în care action=“nume_fişier.php”.
O variabilă se preia dintr-un formular prin una din modalităţile :
$_POST[“nume_variabilă”] sau cu $_GET[“nume_variabilă”] (în funcţie de atributul method al
formului, acesta poate fi post sau get),
33..55 FFuunnccţţiiii îînn PPHHPP
O funcţie poate fi definită oriunde în cadrul script-ului, iar în interiorul unei funcţii poate să apară
orice secvenţă validă de cod (poate cuprinde definirea altor funcţii, clase etc.). Pentru ca funcţia
să returneze un rezultat se foloseşte construcţia return urmată de un parametru ce reprezintă
valoarea funcţiei.
Funcţii de afişare
PHP include doua functii utile pentru generarea datelor de iesire formatate.
printf() si sprintf().
Functia printf() afiseaza datele sale de iesire, iar sprintf() returneaza datele sale de iesire sub forma unei
valori sir.
În general, fiecare functie preia doua sau mai multe argumente. Primul argument este un sir, denumit sir
de formatare, care specifica formatul datelor de iesire, iar celelalte argumente specifica valorile care vor
constitui datele de iesire.
string sprintf ( string $format [, mixed $args [, mixed $... ]] )
Returns a string produced according to the formatting string format.
(a) Parametri
format
Definirea unei funcţii se realizează
function nume_funcţie(param1, param2,…,paramN){ instrucţiuni; }
Apelarea unei funcţii se realizează:
$var_returnată=nume_funcţie(param1,param2,..,paramN);
The format string is composed of zero or more directives: ordinary characters (excluding %) that
are copied directly to the result, and conversion specifications, each of which results in fetching its
own parameter. This applies to both sprintf() and printf().
Each conversion specification consists of a percent sign (%), followed by one or more of these
elements, in order:
1. An optional sign specifier that forces a sign (- or +) to be used on a number. By default,
only the - sign is used on a number if it's negative. This specifier forces positive numbers
to have the + sign attached as well, and was added in PHP 4.3.0.
2. An optional padding specifier that says what character will be used for padding the results
to the right string size. This may be a space character or a 0 (zero character). The default is
to pad with spaces. An alternate padding character can be specified by prefixing it with a
single quote ('). See the examples below.
3. An optional alignment specifier that says if the result should be left-justified or right-
justified. The default is right-justified; a - character here will make it left-justified.
4. An optional number, a width specifier that says how many characters (minimum) this
conversion should result in.
5. An optional precision specifier in the form of a period (`.') followed by an optional
decimal digit string that says how many decimal digits should be displayed for floating-
point numbers. When using this specifier on a string, it acts as a cutoff point, setting a
maximum character limit to the string.
6. A type specifier that says what type the argument data should be treated as. Possible types:
o % - a literal percent character. No argument is required.
o b - the argument is treated as an integer, and presented as a binary number.
o c - the argument is treated as an integer, and presented as the character with that
ASCII value.
o d - the argument is treated as an integer, and presented as a (signed) decimal
number.
o e - the argument is treated as scientific notation (e.g. 1.2e+2). The precision
specifier stands for the number of digits after the decimal point since PHP 5.2.1. In
earlier versions, it was taken as number of significant digits (one less).
o E - like %e but uses uppercase letter (e.g. 1.2E+2).
o u - the argument is treated as an integer, and presented as an unsigned decimal
number.
o f - the argument is treated as a float, and presented as a floating-point number
(locale aware).
o F - the argument is treated as a float, and presented as a floating-point number
(non-locale aware). Available since PHP 4.3.10 and PHP 5.0.3.
o g - shorter of %e and %f.
o G - shorter of %E and %f.
o o - the argument is treated as an integer, and presented as an octal number.
o s - the argument is treated as and presented as a string.
o x - the argument is treated as an integer and presented as a hexadecimal number
(with lowercase letters).
o X - the argument is treated as an integer and presented as a hexadecimal number
(with uppercase letters).
Exemple:
<?php
$num = 5.7;
echo $num;
$num = sprintf("%05.2f", $num); echo '<br>'. $num;
?> Rezultatul afisat va fi: 5.7 05.70
Cu ajutorul expresiei "%05.2f", sprintf() formateaza numarul din $num astfel incat acesta
sa fie format din 5 caractere dintre care unul punct (.) si 2 zecimale.
exemplu cu printf():
<?php
$n = 8;
printf("Valoarea lui n este: %d", $n); ?> Va afisa "Valoarea lui n este: 8".
Funcţii pentru şiruri
str_repeat($şir, $n) – repetă şirul $şir de un număr de n ori.
strrchr($şir, $caracter) –returnează parte a unui $şir, începând cu ultima apariţie a
caracterului $caracter în şirul $şir.
trim($şir) – elimină spaţiile din stânga şi din dreapta unui şir.
explode($separator, $şir) – “rupe” valorile dintr-un şir în care ele sunt delimitate de un
separator, şi le plasează într-un vector
implode($şir, $vector) - preia valorile dintr-un vector şi le reuneşte într-un şir
number_format($număr) – afişează valoarea numerică folosind separatorul de mii.
strpos($sir_princip,$sir_căutat) - returnează poziţia în care se regăseşte şirul căutat în şirul
principal.
substr($şir,$start,$end) – extrage parte dintr-un şir începând din poziţia $start şi până în
poziţia $end.
int strlen(string str) –returnează lungimea unui şir de caractere;
string strstr(sirul de baza, sirul cautat) – returnează subşirul din şirul de bază care începe cu
şirul căutat (exemplu: $email = '[email protected]'; $domain = strstr($email, '@'); print
$domain; // tipareste @utm.com.).
string strtolower( string str) – converteşte un şir la litere mici.
string strtoupper(string str) – converteşte un şir la litere mari.
string ucwords(string str) – converteşte un şir astfel încat va avea fiecare iniţiala a fiecarui
cuvant scrisă cu majusculă. Restul literelor rămân neschimbate.
string ucfirst(string str) – converteşte un şir astfel încât va fi scris cu iniţiala majuscula. Restul
literelor ramân neschimbate.
int strcmp(string str1, string str2) – compară şirul str1 cu şirul str2 din punct de vedere al
codului ASCII, şi returnează urmatoarele valori întregi:<0 dacă str1 este mai mic decat
str2, > 0 dacă str1 este mai mare decat str2 şi 0 dacă sirurile sunt egale.
trim() - funcţie care elimina spatiile goale de al inceputul şi sfarsitul unui sir de caractere
specificat ca parametru (asemanator funcţie standard în C);
Unele funcţii PHP au argumente opţionale, care pot fi specificate sau omise, în conformitate cu
intenţiile programatorului.
Când se produce o eroare în timpul execuţiei unei funcţii, PHP generează mesaje de eroare.
Uneori, asemenea mesaje de eroare sunt nedorite. În acest caz, puteti suprima generarea
mesajelor de eroare prin prefixarea numelui funcţie invocate cu ajutorul caracterului @. De
exemplu, pentru a suprima mesajele de eroare care pot aparea în timpul execuţiei funcţie f( ),
invocati aceasta funcţie dupa cum urmează: Y = @f(x);
Funcţii utilizator
Pentru a defini o funcţie rebuie să se respecte suntaxa:
function nume_funcţie(listă argumente)
{
// corpul funcţie;
}
Section 7.02 Definirea argumentelor prestabilite
PHP va permite să definiţi funcţii cu argumente prestabilite. Dacă invocati o funcţie care are un
argument prestabilit, dar nu furnizaţi nici o valoare pentru argumentul respectiv, argumentul ia o
valoare prestabilită specificată. Exemplu:
function calcul($cant , $rata = 0.011)
{
echo "<BR>cant=$cant";
echo "<BR>rata=$rata";
return $suma * $rata;
}
$cumparaturi = 123.45;
echo "<BR>cumparaturi = $cumparaturi";
$impozit = calcul($cumparaturi,0.16);
echo "<BR>impozit = $impozit";
$cumparaturi = 123.45;
echo "<BR>cumparaturi = $cumparaturi";
$impozit = calcul($cumparaturi);
echo "<BR>impozit = $impozit";
functia isset() preia ca argument de obicei o variabila si arata daca aceasta a fost sau nu gasita. De
exemplu: isset($nr) returneaza TRUE daca variabila "$nr" are setata o valoare (diferita de NULL), in caz
contrar returneaza FALSE.
Aceasta functie este foarte utila in determinarea caror comenzi sa fie executate in functie daca o anumita
variabila a fost setata sau nu. Previne aparitia unor erori care apar in cazuri de variabile nule si ajuta si la
securitate.
Funcţia calcul preia doua argumente: un argument obligatoriu, denumit $cant, şi un argument
prestabilit, numit $rata. Dacă apelati funcţia şi furnizati un singur argument, valoarea
argumentului respectiv se considera ca fiind valoarea argumentului $cant, iar valoarea 0.011 se
foloseste ca valoare a argumentului $rata. Astfel, la prima invocare a funcţie, $rata are valoarea
0.16, specificată drept al doilea argument al funcţie. Cu toate acestea, la a doua invocare a
funcţie, $rata are valoarea 0.011 deoarece este specificata valoarea unui singur argument.
Funcţii pentru lucru cu fişiere
funcţie rol sintaxă
basename primeşte ca parametru un şir reprezentând
un nume de cale şi returnează numele
fişierului din calea respectivă
string basename( string
path)
chgrp schimbă grupul fişierului filename în group
şi nu este diponibilă pe Windows
int chgrp( string
filename, mixed group)
chown schimbă proprietarul fişierului filename cu
user group şi nu este diponibilă pe Windows
int chown( string
filename, mixed user)
copy funcţia copie un fişier sursă într-un fişier
destinaţie. Returnează TRUE dacă copierea
s-a realizat cu succes şi FALSE în caz
contrar.
int copy( string source,
string dest)
dirname funcţia returnează numele directorului din
calea path.
string dirname( string
path)
fclose închide fişierul referit prin fp. Întoarce
TRUE în caz de succes şi FALSE în caz
contrar. Variabila fp trebuie să indice un
fişier valid, adică un fişier deschis cu
fopen() sau fsockopen().
int fclose( int fp)
feof Returnează TRUE dacă pointerul de fişier
este poziţionat pe EOF sau în caz de eroare,
altfel returnează FALSE.
int feof( int fp)
Variabila fp trebuie să
indice un fişier valid,
adică un fişier deschis
cu fopen(), popen() sau
fsockopen().
ffush forţează scrierea tuturor bufferelor de ieşire
în fişierul indicat de fp. Returnează TRUE
în caz de succes şi FALSE în caz contrar.
Variabila fp trebuie să indice un fişier valid,
adică un fişier deschis cu fopen() sau
fsockopen().
int fflush( int fp)
fgetc returnează un caracter citit din fişierul fp.
Returnează FALSE în cazul în care
caracterul citit este EOF.
string fgetc( int fp)
fgets returnează un şir de maxim length-1 octeţi
citiţi din fişierul indicat de fp. Citirea se
încheie când au fost citiţi length-1 octeţi,
când se citeşte new line (este inclus în
valoarea returnată) sau EOF. Dacă apare o
eroare la citire returnează FALSE.
string fgets( int fp, int
length)
file_exists întoarce TRUE dacă fişierul specificat prin
filename există şi FALSE în caz contrar.
int file_exists( string
filename)
funcţie rol sintaxă
filesize întoarce dimensiunea fişierului specificat
prin filename dacă acesta există şi FALSE
în caz de eroare.
int filesize( string
filename)
fopen funcţia deschide un fişier sau un URL. În
cazul deschiderii unui URL se stabileşte o
conexiune către serverul Web specificat.
În cazul unui fişier obişnuit acesta este
căutat în sistemul propriu de fişiere şi
deschis.
int fopen( string
filename, string mode
[, int
use_include_path])
fputs funcţia scrie şirul string în fişierul fp în
întregime (dacă argumentul length lipseşte)
sau numai length octeţi din acesta. fputs()
este un alias pentru fwrite() şi este identic cu
aceasta.
int fputs( int fp, string
str [, int length])
fread funcţia citeşte cel mult length octeţi din
fişierul binar fp. Citirea se încheie când s-au
citit length octeţi sau EOF.
string fread( int fp, int
length)
fwrite funcţia scrie conţinutul argumentului string
în fişierul indicat de fp. Dacă argumentul
length este precizat scrierea se opreşte după
length octeţi sau dacă şirul string s-a
terminat.
int fwrite( int fp, string
string [, int length])
is_file Întoarce TRUE dacă filename există şi este
un fişier obişnuit.
boolean is_file( string
filename)
is_writeable întoarce TRUE dacă filename există şi poate
fi scris.
boolean is_writeable (
string filename)
pclose Închide fişierul indicat de fp. Variabila fp
trebuie să indice un fişier valid care a fost
deschis cu popen() .
int pclose(int fp)
readfile citeşte conţinutul fişierului filename şi îl
tipăreşte la ieşirea standard. În caz de succes
întoarce numărul de octeţi citiţi din fişier şi
FALSE în caz de eşec.
int readfile( string
filename [, int
use_include_path])
rmdir şterge directorul dirname numai dacă acesta
este gol, iar în caz de eroare întoarce 0.
int rmdir( string
dirname)
unlink şterge fişierul filename şi returnează 0 sau
FALSE în caz de eroare.
int unlink( string
filename)
Funcţii pentru lucru cu tablori (array)
funcţie rol sintaxă
array crează şi întoarce un tablou de valori.
Array() este un constructor de limbaj
utilizat pentru a reprezenta tablouri şi
nu o funcţie obişnuită.
array array( [mixed... ])
array_count_val
ues
funcţia returnează un tablou folosind
valorile din tabloul de intrare, input,
drept chei şi frecvenţa lor drept valori.
array array_count_values(
array input)
array_intersect funcţia returnează un tablou conţinând
toate valorile lui array1 care sunt
prezente în toate celelalte argumente;
cheile sunt păstrate.
array array_intersect( array
array1, array array2 [, array
...])
array_keys funcţia returnează cheile (numerice
sau şiruri de caractere) ale tabloului
input.
array array_keys( array
input [, mixed
search_value])
array_merge funcţia concatenează elementele a
două sau mai multe tablouri astfel
încât elementele unui tablou se adaugă
la sfârşitul tabloului precedent.
array array_merge( array
array1, array array2 [, array
...])
array_push funcţia tratează tabloul ca pe o coadă
şi introduce valorile primite ca
argumente la sfârşitul tabloului.
int array_push( array array,
mixed var [, mixed ...])
array_revers funcţia returnează un nou tablou care
conţine elementele tabloului array în
ordine inversă
array array_revers( array
array [, bool
preserve_keys])
array_sum funcţia calculează şi returnează suma
elementelor din tabloul arr ca un
număr întreg sau float.
mixed array_sum( array
arr)
array_unique funcţia elimină valorile duplicate din
tablou; returnează un tablou nou care
nu conţine valori duplicate; cheile nu
se modifică.
array array_unique( array
array)
arsort funcţia sortează descrescător tabloul
array astfel încât legăturile dintre
indicii asociativi şi valorile indicate de
către aceştia să se menţină. Veţi folosi
această funcţie pentru a sorta tablouri
asociative în care ordinea actuală a
elementelor este importantă.
void arsort( array array [,
int sort_flags])
asort funcţia sortează crescător tabloul
array astfel încât legăturile dintre
indicii asociativi şi valorile indicate de
către aceştia să se menţină. Veţi folosi
această funcţie pentru a sorta tablouri
asociative în care ordinea actuală a
elementelor este importantă.
void asort( array array [, int
sort_flags]))
count funcţia returnează numărul de
elemente din argumentul var, care este
de obicei un tablou. Întoarce 1 dacă
variabila nu este un tablou şi 0 dacă
variabila nu a fost iniţializată.
int count( mixed var)
each funcţia returnează cheia curentă şi
valoarea corespunzătoare din tabloul
array şi avansează pointerul tabloului.
Această pereche de valori este
returnată într-un tablou cu 4 elemente,
cu cheile 0, 1, key şi value. Elementele
0 şi key conţin numele elementului din
tablou, iar 1 şi value conţin valoarea.
array each( array array)
rsort funcţia sortează un tablou în ordine
descrescătoare.
void rsort( array array [, int
sort_flags])
sort funcţia sortează elementele unuii
tablou în ordine crescătoare.
void sort( array array [, int
sort_flags])])
sizeof funcţia returnează numărul de
elemente dintr-un tablou.
int sizeof( array array)
Section 7.03 Utilizarea variabilelor globale
Variabilele globale sunt declarate în afara oricarei funcţii. Variabilele de formular reprezinta un
tip important de variabile globale. Cu toate acestea, puteti crea o variabilă globala atribuindu-i
acesteia o valoare, atata timp cat instructiunea de atribuire respectiva nu se afla în interiorul
corpului unei funcţii. Totalitatea locurilor unde este accesibilă o variabilă se numeste domeniu de
existenta al variabilei. în mod prestabilit, variabilele globale nu pot fi accesibile din interiorul
corpului unei funcţii; cu alte cuvinte, domeniul de existenta al unei variabile globale, nu include
corpurile funcţiilor. Dacă doriţi sa obţineţi accesul la o variabilă globala în cadrul unei funcţii,
puteţi extinde domeniul de existenţă al variabilei prin specificarea numelui acesteia în interiorul
unei instructiuni global. Instructiunea global are urmatoarea forma:
global variabilă1, variabilă2, variabilă3;
După cuvântul cheie global pot urma una sau mai multe variabile; fiecare variabilă este separată
prin virgulă. Exemplu de utilizare a instrucţiunii global:
function not_global()
{
echo "<BR>nuglobal: x=$x";
}
function yes_global()
{
global $x;
echo "<BR>global: x=$x";
}
$x = 1;
not_global();
yes_global;
Utilizarea variabilelor locale şi a variabilelor statice
Variabilele globale sunt create atunci cand li se atribuie o valoare şi există pe toată durata
programului. Variabilele locale sunt create la apelarea funcţie asociate şi sunt distruse la
incheierea apelului acesteia. Variabilele locale sunt disponibile doar pe durata execuţiei funcţie
asociate. Exemplu de script care defineşte o variabilă locala $x şi o variabilă globala cu acelaşi
nume.
function este_local()
{
$x = 2;
echo "<BR>corpul funcţie: x = $x";
}
$x = 1;
echo "<BR> corpul scriptutlui: x = $x";
este_local();
echo "<BR> corpul scriptului: x = $x";
Utilizarea variabilelor cookie
Variabilele cookie sunt utile pentru stocarea preferinţelor utilizatorilor şi a altor informaţii care
trebuiesc reţinute atunci când utilizatorul trece la o nouă pagină web. Valorile variabilelor dispar
atunci când scriptul PHP care le conţine îşi încheie execuţia.
Valoarea variabilei cookie este automat pusă la dispoziţie ca variabilă PHP având acelaşi nume
cu acela al variabilei cookie. De exemplu, să presupunem că aţi creat o variabilă cookie denumită
"cursuri" şi că îi atribuiţi valoarea "informatica". Această pereche cursuri-informatica este apoi
pusă la dispoziţia fiecărui script PHP asociat paginilor web. Valoarea variabilei cookie se poate
afişa folosind instrucţiunea
echo "Valoarea variabilei cookie este $cursuri";
care va afişa: Valoarea variabilei cookie este cursuri.
Accesul la o variabilă cookie
Funcţia setcookie() are maxim şase argumente cu semnificaţia:
setcookie(nume, valoare, expirare, cale, domeniu, sigur)
unde:
Nume - numele variabilei:
Valoare – valoarea variabilei
Expirare – timpul dupa care variabila expira
Cale – specifica calea URL asociată variabilei cookie. În mod prestabilit, variabila cookie
este disponibilă pentru scripturile din directorul care conţine scriptul în care a fost
configurată variabila respectivă, precum şi pentru scripturile din sub-directoarele aferente
directorului respectiv. În particular, scripturilor din directoarele părinte ale directorului
care conţine scriptul nu li se permite accesul prestabilit la variabila cookie.
Domeniu - permite să specificaţi numele de domeniu asociat unei variabile cookie.
Variabila cookie va fi disponibilă numai pentru paginile web din cadrul domeniului
specificat.
Sigur - este o valoare întreagă, care specifică dacă o variabilă cookie trebuie trimisă prin
intermediul unei conexiuni sigure (HTTPS). Specificaţi valoarea 1 pentru a împiedica
transmiterea variabilei cookie în cazul în care conexiunea nu este sigură; pentru a permite
transmiterea variabilei cookie prin conexiuni HTTP obişnuite, specificaţi valoarea 0.
Sesiuni în PHP O sesiune reprezintă o metodă de a stoca informaţii (sub formă de variabile) pentru a fi folosite
pe mai multe pagini. Spre deosebire de cookie-uri, informaţia nu este stocată în calculatorul
utilizatorului. Este, de asemenea, diferită de celelalte variabile, în sensul că nu este transmisă
individual către fiecare pagină în parte ci este obţinută din sesiunea deschisă la accesarea fiecărei
pagini.
Crearea şi accesarea sesiunilor. Exemple. Fişierul sesiune.php <?php
// aici este pornita sesiunea
session_start();
//aici sunt stabilite variabilele sesiunii
$_SESSION['cursuri'] = 'cursuri';
$_SESSION['facultate'] = 'facultate';
print 'sfarsit';
?>
Iniţializarea sesiunii se face folosind funcţia session_start(), după care se crează perechi de chei -
valori pe care le stocăm în sesiune. Majoritatea sesiunilor setează un cookie în calculatorul
utilizatorului, iar când o sesiune este deschisă în altă pagină, se scanează calculatorul după acea
cheie. Dacă cele două chei se potrivesc, atunci sesiunea este accesată, dacă nu, o nouă sesiune
este iniţializată.
Modificarea şi distrugerea sesiunilor
IImmpplliicciitt,, oo sseessiiuunnee eessttee aaccttiivvăă aattââtt ttiimmpp ccââtt eessttee bbrroowwsseerruull ddeesscchhiiss.. AAcceesstt lluuccrruu ppooaattee ffii mmooddiiffiiccaatt
eeddiittâânndd ffiişşiieerruull pphhpp..iinnii şşii sseettâânndd ooppţţiiuunneeaa sseessssiioonn..ccooookkiiee__lliiffeettiimmee == 00 ((ttiimmppuull eessttee iinn sseeccuunnddee)) ssaauu
uuttiilliizzaanndd ffuunnccttiiaa sseessssiioonn__sseett__ccooookkiiee__ppaarraammss(())..
Exemplu <?php
// pornire sesiunea
session_start();
$_SESSION['cursuri']='cursuri';
// eliminarea unei variabile din tablou
unset($_SESSION['facultate']);
// eliminarea tuturor valorilor din tablou fara a distruge sesiunea in
sine
session_unset();
// aici distrugem toata sesiunea
session_destroy();
?>
33..66 PPrrooggrraammaarreeaa oorriieennttaattăă ppee oobbiieeccttee ((PPOOOO)) îînn PPHHPP
În programarea orientată-obiect un sistem informatic este privit ca un model fizic de simulare a
comportamentului unei părţi din lumea reală sau conceptuală. Acest model fizic este definit prin
intermediul unui limbaj de programare şi el se concretizează într-o aplicaţie ce poate fi executată
pe un sistem de calcul.
În PHP 4.x nu sunt implementate toate facilităţile POO. Pentru programarea pe obiecte în PHP,
este recomandata utilizarea PHP5.
O clasa este o colectie de variabile şi funcţii care operează asupra variabilelor respective.
Implementarea unei clase conţine atât variabile, cât şi funcţii, ea reprezentând un şablon
(template) cu ajutorul căruia pot fi create instanţe specifice. Sintaxa folosită pentru declararea
unei clase în PHP este:
class nume_clasa {
// date membre
var nume_variabilă_1
...
var nume_variabilă_m
// metode
function nume_funcţie_1 (parametri) {
... // definitia funcţie
}...
function nume_funcţie_n (parametri) {
... // definirea funcţie
}
}
Pentru numele unei clase poate fi utilizat orice identificator permis în PHP cu o singura exceptie:
sdtclass; acest identificator este folosit de PHP în scopuri interne. Pentru a initializa variabilele cu
valori care nu sunt constante trebuie folosit un constructor.
Obiecte
Un obiect reprezinta o variabilă de tipul clasei. Fiecare obiect are o serie de caracteristici, sau
proprietăţi cât şi anumite funcţii predefinite numite metode. Aceste proprietăţi şi metode ale unui
obiect corespund variabilelor şi funcţiilor din definiţia clasei.
Operaţia de initializare a unui obiect se numeşte instanţiere. Clasele pot fi folosite pentru
a genera instanţe multiple. Instanţierea (trecerea de la clasa la obiect) reprezintă, atribuirea unor
Printre avantajele programarii pe obiecte sunt:
cod mai structurat şi mai lizibil,
lucrul organizat,
depanarea mai usoara a programelor,
refolosirea codului,
Dezavantajele principale sunt:
rulează mai încet,
timpii de dezvoltare sunt mai mari.
proprietăţi specifice clasei, astfel încât aceasta să indice un obiect anume, care se diferenţiază de
toate celelalte obiecte din clasa printr-o serie de atribute.
Proprietăţi
În corpul unei clase, se pot declara variabile speciale, numite proprietăţi. În PHP 4.x
acestea se declară cu cuvantul cheie var în fata.
/**
* PHP versiunea 4
*/
class Dictionar {
var $traduceri = array();
var $tip = “Ro”;
}
Aceasta sintaxa este în continuare acceptata (în PHP 5), dar doar pentru a asigura
compatibilitate cu versiuni anterioare de PHP.
In PHP 5, codul arata astfel:
/**
* PHP versiunea 5
*/
class Dictionar {
public $traduceri = array();
public $tip = “Ro”;}
Proprietăţile obiectelor se pot accesa folosind operatorul "->".
Section 7.04 Metode
Metodele sunt funcţii cu ajutorul carora se poate opera asupra variabilelor clasei. Într-o formă
simplă, metodele sunt funcţii declarate în interiorul unei clase.
$this este o pseudo variabilă ce reţine adresa obiectului curent (referinţa către obiectul
curent). Exemplu:
class operatori {
var $x = 5;
var $y = 4;
function Suma ( ) {
return $this -> x + $this -> y;
}
function Produs ( ) {
return $this -> x * $this -> y;
}
}
Pentru a crea un obiect de tipul operatori vom utiliza o instructiune $oper = new
operatori; Metodele clasei se pot apela
echo "suma este ".$operatori -> Suma ( )."<br>";
echo "produsul este ".$operatori -> Produs ( );
Section 7.05 Constructori
Un constructor este o metoda (funcţie) a unei clase care este apelata automat în momentul în care
este creata o noua instanta a clasei (cu ajutorul operatorului new). în PHP este considerata ca
fiind un constructor orice funcţie care are acelasi nume cu clasa în interiorul careia este definita.
Constructorii pot fi folosiţi pentru initializarea datelor membre cu valori care nu sunt constante.
Ei pot avea argumente, iar acestea pot fi optionale. Pentru a putea utiliza clasa fara a specifică
nici un parametru în momentul crearii unui obiect, se recomanda stabilirea unor valori implicite
pentru toate argumentele constructorului. În cazul în care nu este definit un constructor pentru o
anumita clasa, se utilizează constructorul clasei de bază, dacă aceasta există.
Section 7.06 Destructori
În cadrul claselor definite în limbajul PHP 5 pot fi declarati destructori de clase. Destructorii sunt
utilizati în momentul distrugerii (eliberării memoriei alocate) unui obiect. Un obiect este distrus
(eliminat din memorie) în momentul în care nu mai există referinte către el. Necesitatea
destructorilor a apărut în momentul în care s-a pus problema transmiterii obiectelor prin referintă
şi nu prin valoare cum se efectua transmiterea obiectelor în versiunile anterioare ale
interpretorului.
Un destructor este dat de o metodă al cărui nume este __destruct() şi care nu are parametri.
La fel ca şi în cazul constructorilor, în momentul apelului unui destructor pentru o clasă, nu este
apelat automat destructorul părintelui, acesta trebuie apelat cu instructiunea:
parent::__destruct().
33..77 UUttiilliizzaarreeaa MMyySSQQLL
MySQL este un server de baze de date disponibil gratuit, cu sursa deschisă (open-source) care
oferă fiabilitate şi avantaje reale. A fost dezvoltat de firma suedeză MySQL AB. Administrarea
bazei de date se realizeăză folosind utilitare care lucrează în linia de comandă. Cel mai important
utilitar este mysql, un shell interactiv pentru controlul şi interogarea bazei de date. Utilitarele
rulează cel mai bine pe sistemul Linux, platformă pe care MySQL a fost dezvoltat iniţial. Alte
două utilitare cu sursă deschisă, oferite pe platformă Windows, care oferă un set de comenzi de
administrare sunt MySqlManager, un utilitar de interogare în mod grafic similar cu mysql şi
WinMySQL admin, o consolă pentru administrarea detaliilor configurării lui MySQL. Recent cea
mai utilizată metodă pentru serverele care au instalat panoul de comandă CPANEL este
PHPMyAdmin, care oferă o interfată grafică pentru manipularea datelor din MySQL.
MySQL operează în bază unui model client/server. Orice maşină care doreşte sa
proceseze interogări asupra unei baze de date MySQL trebuie să ruleze MySQL server(mysqld),
care este responsabil de tot traficul de tip intrări/ieşiri (incoming/outgoing) cu bază de date.
Modelul de securitate folosit de MySQL se bazează pe nume de utilizator, parolă, nume server
(hostname) sau adresă de IP şi privilegii, fiind similar celui generic folosit de sistemele Unix. Prin
privilegii se înţeleg în cazul MySQL operaţiunile ce vor fi permise asupra bazei/bazelor de date,
tabelelor sau indecşilor, cum sunt de exemplu SELECT, INSERT, UPDATE, DELETE,
CREATE, DROP.
Datele sunt obiectul celor mai multe operaţii de prelucrare, iar sistemele de gestiune a
bazelor de date furnizează cele mai complexe şi puternice facilităţi pentru lucrul cu datele. PHP
include o bibliotecă de funcţii care furnizează o interfaţă cu sistemul MySQL de gestiune a
bazelor de date. Folosind aceste funcţii, un program PHP poate obţine accesul la datele rezidenţe
într-o bază de date MySQL şi le poate modifica.
O baza de date (în cazul nostru MySQL) este un program ce poate stoca o cantitate foarte mare de
informaţii şi o poate organiza într-un format accesibil în mod direct sau de către un alt program
(in cazul nostru PHP).
Într-o bază de date, informaţia este organizată sub formă tabelară, în care coloanele se numesc
câmpuri iar liniile se numesc înregistrări. Capul de tabel determină structura bazei de date. Un
sistem de gestionare a bazelor de date (SGBD) este un program care permite utilizatorilor
interacţiunea cu baza de date. Un SGBD asigură:
crearea bazei de date
introducerea informaţiilor în baza de date
actualizarea informaţiilor
extragerea datelor
controlul accesului la date
Obiectivul esenţial, al unui SGBD este furnizarea unui mediu eficient, adaptat utilizatorilor care
doresc să consulte sau să actualizeze informaţiile conţinute în baza de date.O baza de date poate
conţine mai multe tabele, ce pot fi legate intre ele.
Un câmp se caracterizează prin:
numele câmpului (reprezintă un nume simbolic prin care câmpul se poate identifica),
tipul câmpului (pentru identificarea tipului de date care pot fi stocate în câmpul respectiv),
lungimea câmpului (numărul maxim de caractere care pot fi stocate în câmpul respectiv).
MySQL a fost creat în anul 1996 de către o compania suedeză şi este un SGBD foarte rapid, care
poate lucra cu baze de date de mari dimensiuni. MySQL permite lucru cu câmpuri numerice,
dată şi şir.
Caracteristicile MySQL-ului sunt:
este o platformă deosebit de stabilă;
este independent de sistemul de operare pe care ruleaza (Windows, Linux,
Unix, etc);
este gratuit în anumite condiţii de licenţiere (Open Source Software) .
Afişarea interogării în execuţie şi rularea ei pe baza de date se face cu ajutorul unor aplicaţii
separate. Cele mai bune două instrumente sunt:
Monitorul MySQL – un instrument cu linie de comandă pentru interactionarea cu
serverul MySQL;
phpMyAdmin, o interfaţă MySQL bazată pe PHP.
Câmpuri numerice
Unul dintre cele mai utilizate tipuri de câmpuri în MySQL este Int (integer), care poate stoca
valori cuprinse între –2.143.483.648 şi 2.143.483.643. Acest tip de câmp poate fi folosit cu
opţiunea auto_increment, pentru a defini cheia primară a unei tabele. Cheia primara este un câmp
care face posibilă identificarea unica a fiecărei înregistrări. De obicei este vorba de un câmp
numeric, care va fi incrementat la fiecare operaţie de adăugare.
Tipuri de câmpuri dată/oră
Există în MySQL cinci tipuri de câmpuri folosite pentru stocarea datei calendaristice şi a orei care
sunt:
Date
Datetime
Timestamp
Time
Year
Câmpul de tip date stochează valori în format AAAA-LL-ZZ şi permite introducerea valorilor
cuprinse între 1000-01-01 şi 9999-12-31.
Câmpul de tip datetime stochează valori în format AAAA-LL-ZZ HH:MM:SS, cuprinse între
1000-01-01 00:00:00 şi 9999-12-31 23:59:59.
Câmpul de tip timestamp stochează automat timpul atunci când se modifică valoarea unei
înregistrări (printr-o operaţie de introducere sau actualizare).
Câmpul de tip time stochează timpul în format HH:MM:SS.
Câmpul de tip year poate stoca date cuprinse între 1901 şi 2155.
Câmpuri de tip şir sunt:
Char
Varchar
Tinytext
Text
Mediumtext
Longtext
Enum
Câmpul de tip char are lungimea maximă de 255 caractere. Este de lungime fixă (atunci când
introducem o valoare cu lungimea mai mică decât lungimea maximă a câmpului, câmpul va fi
completat în partea dreaptă cu spaţii).
Câmpul de tip varchar are lungimea maximă de 255 caractere, dar este de lungime variabilă
(câmpurile nu vor mai fi completate cu spaţii ca la tipul char).
Câmpurile de tip blob şi text pot stoca o cantitate variabilă de date.
Câmpurile de tip enum permit stocarea unei valori dintr-o mulţime de valori specificată.
Principalele comenzi MySQL
Cele mai uzuale operaţii cu bazele de date sunt:
Co
manda Semnificatie
CR
EATE
crează o baza de date sau un
tabel
DR
OP sterge o baza de date sau un tabel
INS
ERT adauga inregistrari intr-un tabel
DE
LETE sterge inregistrari dintr-un tabel
UP
DATE
actualizeazăninregistrarile dintr-
un tabel
SE
LECT selectează un tabel
AL
TER modifică structura unui tabel
SH
OW Afişare baze de date, tabele
US
E Deschide o bază de date
1. Crearea unei baze de date se face cu comanda:
CREATE DATABASE nume_bază;
De exemplu, crearea bazei de date, numită student se realizează cu comanda
CREATE DATABASE student;
Caracterul ; este obligatoriu la sfârşitul oricărei comenzi..
2. Afişarea bazelor de date existente pe server se face cu comanda:
SHOW DATABASES;
3. Accesarea (deschiderea) unei baze de date pentru a putea fi folosită se face cu comanda:
USE nume_bază;
4. Crearea unei tabele într-o bază de date presupune mai întâi deschiderea bazei de date şi apoi
crearea propriu-zisă a tabelei:
USE biblioteca;
CREATE TABLE carti (
codc int(4) NOT NULL auto_increment,
numecarte varchar(40) default NULL,
autor varchar(30) default NULL,
data date default NULL,
pret int(3) NOT NULL default '0',
stoc int(5) default NULL,
valoare int(5) default NULL,
PRIMARY KEY (codc)
) TYPE=MyISAM;
Explicaţii:
o AUTO_INCREMENT funcţionează cu orice tip intreg. La fiecare rând nou adăugat
în baza de date, numarul asociat va fi incrementat;
o NULL înseamnă fără valoare (diferit de spaţiu sau zero);
o NOT NULL înseamnă că orice înregistrare completată cu ceva;
PRIMARY KEY reprezintă elementul de referinţă pentru fiecare linie.
5. Afişarea tabelelor conţinute de o bază de date presupune deschiderea bazei de date şi apoi
folosirea comenzii
SHOW TABLES;
6. Afişarea structurii unei tabele se face cu comanda
DESC nume_tabelă;
În acest caz, vor fi afişate numele câmpurilor, tipul şi lungimea lor.
7. Pentru a modifica structura unei tabele se foloseşte comanda ALTER TABLE. De exemplu, pentru a modifica lungimea câmpului pret de la int(3) la int(4) se foloseşte comanda
ALTER TABLE carti MODIFY pret int(4);
Pentru a adăuga un nou câmp, numit observatii, comanda este:
ALTER TABLE `cursuri`.`carti` ADD `observatii` VARCHAR(40) NOT NULL;
Pentru a schimba denumirea câmpului observatii în obs, comanda este:
ALTER TABLE `cursuri`.`carti` CHANGE `observatii` `obs` VARCHAR(40) NOT NULL;
8. Ştergerea unei tabele se face cu comanda
DROP TABLE;
De exemplu, pentru ştergerea tabelei numită „diverse”, vom folosi comanda
DROP TABLE diverse;
Comanda DROP TABLE trebuie folosită cu mare grijă, întrucât, în urma executării ei, atât
structura cât şi datele conţinute în tabele sunt şterse.
9. Comanda INSERT introduce înregistrări într-o tabelă existentă.
Forma generală a comenzii este:
INSERT INTO nume_tabelă [(câmp1,camp2,…,câmp n)] VALUES (valoare1,valoare2,…,
valoare n);
10. Comanda SELECT este utilizată pentru a extrage înregistrările din una sau mai multe tabele.
Sintaxa generală este:
SELECT [DISTINCT] câmp1, câmp2,…, câmp n
FROM nume_tabelă
WHERE condiţie
GROUP BY nume_câmp
ORDER BY nume_câmp [ASC | DESC]
LIMIT [numărul_primei_înregistrări_dorite, numărul_de_înregistrări_returnat]
PHP permite lucrul cu un număr mare de funcţii MySQL. În PHP exista funcţii pentru toate
operatiile executate asupra bazelor de date MySQL. Cele mai importante funcţii sunt:
mysql_connect() – stabileşte o conexiune la serverul de baze de date MySQL.
Conectarea la MySQL se face astfel:
<?php $link = mysql_connect("mysql_host","mysql_user","mysql_password") or
die("Nu se poate conecta");
?>
Dacă MySQL este instalat pe staţia de lucru atunci conexiunea la baza de date se
realizează:
<?php
$link = mysql_connect("localhost", "root", "")
or die("Nu se poate conecta");
?>
Funcţia die nu face altceva decat să afiseze mesajul şi să nu mai execute nici un cod după.
Variabilă $link reprezintă un identificator pentru aceasta conxiune.
mysql_select_db() – selectează o bază de date.
Sintaxa este: mysql_select_db(“nume bază”) or die (“baza de date nu poate fi selectata!”).
După conectarea, trebuie să-i spunem serverului MySQL ce baza de date dorim sa folosim,
operaţie ce se realizează:
<?php $link = mysql_connect("mysql_host", "mysql_user", "mysql_password
") or die("Nu se poate conecta"); mysql_select_db("cursuri", $link) or die("nu se poate alege baza
de date"); ?>
Funcţia mysql_select_db este cea care îi transmite serverului MySQL ce bază de date vrem sa
folosim.
mysql_query() – interoghează o bază de date aflată pe server.
Sintaxa este: $resultat=mysql_query(“Interogare SQL”)
Exemplu: $resultat=mysql_query("select * from utizatori")
mysql_fetch_array() – returnează un array (matrice) corespunzător interogării efectuate.
mysql_num_rows() – returnează numărul înregistrărilor (rândurilor) rezultate dintr-o interogare.
mysql_affected_rows() – returnează numărul de înregistrări(rânduri) afectate de o interogare
INSERT, DELETE SAU UPDATE. Această funcţie nu operează şi cu comanda SELECT.
mysql_free_result() – eliberează zona de memorie folosită de o interogare. Această funcţie este
utilă în cazul în care interogarea returnează un număr mare de rezultate, după care scriptul
continuă să execute operaţii.
mysql_close() – închide o conexiune MySQL.
Când o conexiune este închisă (fie folosind această funcţie, fie la terminarea scriptului), PHP
eliberează memoria folosită de interogare.
mysql_create_db() – crează o bază de date MySQL.
mysql_drop_db() – şterge o bază de date MySQL.
mysql_list_dbs() – returnează bazele de date aflate pe un server MySQL.
mysql_list_tables() – returnează tabelele dintr-o bază de date MySQL. Această funcţie trebuie
folosită împreună cu funcţia mysql_tablename().
mail($to, $subject, $message, $headers) – funcţie folosită pentru a trimite un email (de la $to,
cu subiectul $subiect, având ca mesaj $message cu headerele adiţionale $header);
mysql_error() – returnează mesajul de eroare sub forma de şir de caractere generat de baza de
date MySQL dacă este cazul;
session_start() - initializează o secţiune de date bazata pe ID-ul de sesiune trimis printr-o cerere
GET sau POST;
session_destroy()- distruge toate datele asociate cu sesiunea curentă;
ob_start()- opreşte afişarea bufferului până la terminarea execuţiei scriptului;
print() - initializeaza listarea la imprimanta a unei pagini web;
require() - funcţie care include în scriptul curent conţinutul unui fişier cu verificarea de a fi
introdus o singura dată (spre deosebire de funcţia include() - care permite includerea fişierului de
mai multe ori);
crypt($pass, "BB") – funcţie care criptează un şir de caractere ($pass) după o cheie de criptare
(BB);
Section 7.07 Lista functii php pentru lucru cu baze de date MySql
mysql_affected_rows — Numarul de randuri afectate de ultima operatie MySQL
mysql_change_user — Schimba utilizatorul pentru conexiunea curenta
mysql_client_encoding — Intoarce numele setului de caractere curent
mysql_close — Inchide conexiunea la MySQL
mysql_connect — Creeaza o conexiune la MySQL
mysql_create_db — Creaza o noua baza de date MySQL
mysql_data_seek — Move internal result pointer
mysql_db_name — Get result data
mysql_db_query — Send a MySQL query
mysql_drop_db — Drop (delete) a MySQL database
mysql_errno — Returns the numerical value of the error message from previous MySQL operation
mysql_error — Returns the text of the error message from previous MySQL operation
mysql_escape_string — Escapes a string for use in a mysql_query
mysql_fetch_array — Fetch a result row as an associative array, a numeric array, or both
mysql_fetch_assoc — Fetch a result row as an associative array
mysql_fetch_field — Get column information from a result and return as an object
mysql_fetch_lengths — Get the length of each output in a result
mysql_fetch_object — Fetch a result row as an object
mysql_fetch_row — Get a result row as an enumerated array
mysql_field_flags — Get the flags associated with the specified field in a result
mysql_field_len — Returns the length of the specified field
mysql_field_name — Get the name of the specified field in a result
mysql_field_seek — Muta pointerul rezultatului la un camp specificat
mysql_field_table — Get name of the table the specified field is in
mysql_field_type — Get the type of the specified field in a result
mysql_free_result — Free result memory
mysql_get_client_info — Aflare informatii client MySQL
mysql_get_host_info — Get MySQL host info
mysql_get_proto_info — Get MySQL protocol info
mysql_get_server_info — Get MySQL server info
mysql_info — Get information about the most recent query
mysql_insert_id — Get the ID generated from the previous INSERT operation
mysql_list_dbs — List databases available on a MySQL server
mysql_list_fields — List MySQL table fields
mysql_list_processes — List MySQL processes
mysql_list_tables — List tables in a MySQL database
mysql_num_fields — Get number of fields in result
mysql_num_rows — Get number of rows in result
mysql_pconnect — Open a persistent connection to a MySQL server
mysql_ping — Ping a server connection or reconnect if there is no connection
mysql_query — Send a MySQL query
mysql_real_escape_string — Escapes special characters in a string for use in a SQL statement
mysql_result — Get result data
mysql_select_db — Select a MySQL database
mysql_set_charset — Sets the client character set
mysql_stat — Get current system status
mysql_tablename — Get table name of field
mysql_thread_id — Return the current thread ID
mysql_unbuffered_query — Send an SQL query to MySQL, without fetching and buffering the result rows
Tema propusa
Să se creeze în baza de date agenda, tabela prieteni, care va avea structuta:
CREATE TABLE prieteni (
id int(3) NOT NULL auto_increment,
nume varchar(15) default NULL,
prenume varchar(15) default NULL,
virsta tinyint(3) default NULL,
telefon varchar(10) default NULL,
adresa text,
poze varchar(20) default NULL,
PRIMARY KEY (id)
) TYPE=MyISAM;
Să se realizeze o interfaţa cu ajutorul căreia să se populeze tabela, să se actualizeze numarul de
telefon, să se ştergă înregistrări pe bază de id şi eventual să se afişeze conţinutul tabelei. Interfaţa
va arăta ca în figura de mai jos.
EExxeemmpplluu ddee ssccrriipptt ccaarree uuttiilliizzeeaazzăă ffuunnccţţiiiillee pprriinntt__rr şşii iimmppllooddee.. <?php
$t=array("ianuarie", "februarie","martie","aprilie", "mai","iunie","iulie","august"
,"septembrie","octombrie","noiembrie","decembrie");
echo $t[4]."<br><br><br><br>";
for ($i=0;$i<12;$i++)
echo $t[$i]."<br>";
sort ($t);
echo"<br>";
for ($i=0;$i<12;$i++)
echo $t[$i]."<br>";
echo "<br><br><br><br><br>";
//for ($i=0;$i<12;$i++)
//echo $t[$i]."<br>";
print_r($t);
echo "<br>";
echo "<br>";
echo "<br>";
$tab=array ("primul"=>"luni",
"al doilea"=>"marti",
"al treilea"=>"miercuri");
echo $tab["primul"];
echo "<br>";
echo "<br>";
echo "<br>";
print_r($tab);
echo "<br>";
echo "<br>";
echo "<br>";
$sir=implode($tab,", ");
echo $sir;
?>
Aplicatie: introducem date intr-un formular cu 2 campuri nume şi prenume şi apoi cu ajutorul
scriptul insert.php datele se introduc în baza de date.
/* fisierul adaugare.html */
<html>
<head>
<title>Formular</title>
</head>
<body>
<b>Adaugare inregistrari</b>
<form method="POST" action="insert.php">
Nume: <input type="text" name="nume"><br>
Prenume: <input type="text" name="prenume"><br>
<input type="submit" value="Trimite">
</form>
</body>
</html>
/* fisierul insert.php */
<?php
include "conexiune.php";
$nume=$_POST['nume'];
$prenume=$_POST['prenume'];
$query="INSERT INTO proba (nume, prenume) VALUES
'$nume','$prenume')";
if (!mysql_query($query)) {
die(mysql_error());
} else {
echo "datele au fost introduse";
}
mysql_close($conexiune);
?>
Pentru a afişa fiecare rănd din tabel se foloseşte o bucla while şi comanda mysql_fetch_row, ca în
exemplu:
<?php
include "conexiune.php";
$sql=mysql_query("SELECT * FROM carti");
echo "<table border=1>";
echo "<tr><td>ID</td><td>titlu</td><td>Autor</td></tr>";
while ($row=mysql_fetch_row($sql)) {
echo "<tr><td>$row[0]</td><td>$row[1]</td><td>$row[2]</td></tr>";
}
echo "</table>";
mysql_close($conexiune);
?>
Datele au fost afisate fiecare intr-o celula a unui tabel.
Folosind funcţia mysql_num_rows($sql) putem afla numarul de linii continute de baza de
date. Exemplu precedent la care se adaugă numarul de linii al tabelei din baza de date.
/* urmează fisierul select.php */
<?php
include "conexiune.php";
$sql=mysql_query("SELECT * FROM carti");
$rows=$mysql_num_rows($sql);
echo "<b>$rows</b> inregistrari în baza de date<p>";
echo "<table border=1>";
echo "<tr><td>ID</td><td>titlu</td><td>autor</td></tr>";
while ($row=mysql_fetch_row($sql)) {
echo "<tr><td>$row[0]</td><td>$row[1]</td><td>$row[2]</td></tr>";
}
echo "</table>";
mysql_close($conexiune);
?>
Exemplu: cautarea în baza de date dupa o anumita inregistrare folosind conditia WHERE.
/* urmează fisierul cautare.html */
<html>
<head><title>Cautare</title>
</head>
<body>
<b>Cautare inregistrari</b>
<form method="POST" action="where.php">
Numele cautat: <input type="text" name="nume1"><br>
<input type="submit" value="Trimite">
</form>
</body>
</html>
/* urmează fisierul where.php */
<?php
include "conexiune.php";
$nume1=$_POST['nume1'];
$sql=mysql_query("SELECT * FROM proba WHERE nume='$nume1'");
echo "<table border=1>";
echo "<tr><td>ID</td><td>Nume</td><td>Prenume</td></tr>";
while ($row=mysql_fetch_row($sql)) {
echo "<tr><td>$row[0]</td><td>$row[1]</td><td>$row[2]</td></tr>";
}
echo "</table>";
mysql_close($conexiune);
?>
UUnniittaatteeaa ddee iinnvvaattaarree IIVV..
CCOONNSSTTRRUUIIRREEAA DDOOCCUUMMEENNTTEELLOORR XXMMLL
Aceasta unitate are ca scop cunoasterea regulilor pe care trebuie să le respecte documentele
XML. Regulile sunt simple, multe dintre ele fiind cunoscute de la HTML. Regulile XML pot fi
clasificate în două categorii: reguli de sintaxă XML si reguli de validitate a documentelor XML
Materialul trebuie parcurs în ordinea sa firească prezentată în continuare, inclusiv în zona
referitoare la aplicatii. Se recomandă testarea tagurilor XML si consultarea Internetului
pentru detalii si informatii suplimentare (www.w3schools.com). Timpul minim pe care
trebuie să-l acordati acestui modul este de 8 ore.
Cuprins:
4.1. Construcţia documentelor XML şi importanţa acestora
4.2. Caracteristicile lui XML
4.3. Construcţia prologului unui document XML
4.4. XML-ul ca bază de date
4.5. Date, documente şi baze de date
4.6. Stocarea documentelor în BLOB-uri
4.7. Sisteme de management ale conţinuturilor
După parcurgerea si însusirea acestei teme, studentul va fi capabil:
- sa construiasca documente XML
- sa construiasca prologul unui document XML
- sa utilizez XML ca baza de date
- sa cunoasca modul de stocare a documentelor in BLOB-uri
- sa cunoasca importanta sistemelor de management al continuturilor
Cuvinte cheie: XML, DTD-ul, DOCTYPE, Date, documente, baze de date, RSS, Blob-uri
Article VIII. 4.1 Construirea documentelor XML şi importanţa acestora
XML (Extensible Markup Language ) este o formă condensată a Standard Generalized
Markup Language (SGML) care permite dezvoltatorilor să creeze etichete particularizate,
care oferă flexibilitate în organizarea şi prezenţarea informaţiilor. XML este format de fapt
din două metalimbaje, ambele descrise în acelaşi document. Primul este un set de reguli
pentru realizarea de documente XML construite corect, în timp ce al doilea este un set de
reguli pentru realizarea unei definiţii a tipului documentului XML, sau DTD (Document
Type Definition), care permite ca structura documentului XML să se supună unor
constrângeri şi să fie validată faţă de acele constrângeri.
XML are o natură duală fiind:
un metalimbaj care permite descrierea de noi structuri de documente şi vocabulare;
un limbaj utilizat ca să exprime acea structură şi acel vocabular în cazul unui
document.
Section 8.01 Section 8.02 Definiţiile tipului documentului XML (DTD-urile) descriu instanţe ale
limbajului XML, numite uneori vocabulare XML. Dcumentele XML sunt create utilizând
acele limbaje.
XML este un limbaj cu etichete şi atribute asemănător cu HTML, dar un HTML
transformat atât de mult, încât nu mai poate fi recunoscut. XML este mult mai structurat
decât HTML. În timp ce procesoarele HTML acceptă în mod curent cod incorect şi diform
şi încearcă să îi dea sens pe ecran, XML trebuie să se oprească atunci când găseşte o
eroare fatală, care poate fi aproape orice tip de eroare.
Dacă în HTML avem un număr relativ mic de etichete, XML are un număr de
etichete aproape infinit, structurate în aproape orice fel se doreşte. Oricum, fundamentele
au rămas aceleaşi, XML reprezentând un pas evolutiv al HTML. Cu toate că orice
procesor XML poate spune despre o porţiune de cod dacă este sau nu construit corect, iar
un manual poate ajuta la construirea unui document valid, DTD-ul permite verificarea fără
ambiguităţi a codului. Totuşi, în funcţie de tipul de creare utilizat, acesta poate fi un pas
diferit de procesul de editare.
Codul îndeplineşte acest ideal în funcţie de utilizarea dată numelor etichetelor, totuşi între
anumite limite:
Numele de etichete care încep cu şirul “xml”, indiferent de tipul literelor, sunt
rezervate; adică, indiferent de situaţie, nu este permisa crearea lor;
Numele de etichete care conţin caracterul două puncte pot fi interpretate ca
identificatori având asociată o zonă de nume, deci utilizarea celor două puncte în
numele etichetelor este puternic combătută şi poate fi chiar interzisă;
Un nume de etichetă trebuie să înceapă cu o “literă”, care în acest context este orice
literă sau ideogramă Unicode/ISO/IEC 10646, sau cu o liniuţă de subliniere.
4.2 Caracteristicile lui XML
XML este sensibil la tipul literelor deoarece majusculele nu reprezintă un
concept universal – Dacă s-ar trata literele mari şi mici ca fiind echivalente, ar
trebui să se facă la fel pentru mii de alte variante de litere în alte limbi, o operaţie
împovărătoare. Unele limbi nici nu au tipuri de litere. De exemplu, în limba ebraică
nu există litere mici, iar limba arabă nu face distincţie între forma iniţială, de mijloc
şi finală a literelor. Pentru cei care preferă să scrie etichetele cu majuscule şi
atributele cu litere mici, pentru a le evidenţia, aceasta este o ştire teribilă. Dar
editoarele de cod moderne nu mai acordă o importanţă aşa de mare acestui lucru ca
înainte. De exemplu, precizarea anumitor culori pentru a marca etichete este un
lucru obişnuit, deci utilizarea majusculelor este întrucâtva un anacronism istoric,
asemenea numerelor de linii în COBOL.
XML este foarte precis cu privire la imbricarea corectă a etichetelor .
Etichetele nu se pot încheia într-un context diferit de cel de început. Deci, dacă se
doreşte <bold> <italics>, fraza evidenţiată trebuie închisă cu </italics></bold>,
pentru a evita o eroare fatală. Deoarece XML poate referi şi include documente
XML şi fragmente de documente oriunde pe Web, fiecare document XML trebuie
să se supună aceloraşi reguli pentru a nu strica documentele altora.
XML nu este bine protejat împotriva recursivităţii – Cu toate că este posibilă
stabilirea excluderilor explicite la un anumit nivel, la o structură complexă a unui
document este dificilă menţinerea acelor excluderi la un nivel redus, mai ales atunci
când se utilizează etichete care pot fi aplicate la orice nivel. Deci, interdicţia HTML
referitoare la includerea unei etichete ancoră <a> în interiorul altei etichete ancoră
există şi în XML, dar nu este impusă dincolo de includerea directă.
XML obligă la închiderea fiecărei etichete, chiar şi a etichetelor vide – Deoarece
este posibila crearea unui document XML care să nu utilizeze un DTD, un procesor
XML nu are de unde să ştie dacă o etichetă este sau nu vidă. Deoarece toate
documentele XML trebuie să fie construite corect, etichetele vide trebuie marcate
cu o sintaxă specială care spune unui procesor XML că eticheta este vidă şi închisă.
Acest lucru se realizează plasând un spaţiu şi un caracter slash la sfârşitul etichetei,
astfel: <break />
XML necesită încadrarea valorilor atributelor fie între apostrofuri, fie între
ghilimele – Acolo unde HTML este indulgent, mai ales în ceea ce priveşte numerele
şi aproape orice şir fără spaţii în interior, XML tratează totul ca şir de caractere şi
lasă aplicaţia să îşi dea seama singură de toate acestea.
XML recunoaşte mai multe limbi – Spre deosebire de HTML, seturile de
caractere extinse utilizate în multe limbi europene nu sunt pe deplin recunoscute în
mod prestabilit. Există un mecanism simplu pentru includerea acestora, precum şi a
întregului set de caractere Unicode (cunoscut, de asemenea, şi ca ISO/IEC 10646)
care are peste un milion de caractere, deci suportul pentru chineză, arabă şi multe
alte limbi mai exotice ale lumii este un lucru uşor. În afară de diferenţele menţionate
în această listă, XML este foarte asemănător cu HTML din punctul de vedere al
marcării etichetelor, al argumentării atributelor şi al trecerii conţinutului între
perechi de etichete.
4.3 Construirea prologului unui document XML
Prologul unui document XML conţine mai multe instrucţiuni. Prima, declaraţia XML,
afirmă că documentul următor este XML. Cea de a doua, declaraţia tipului documentului
(Document Type Declaration), este metodă utilizata pentru a identifica definiţia tipului
documentului (Document Type Definition - DTD) folosită de un anumit document. Faptul
că acronimul DTD poate fi aplicat la Document Type Declaration este o coincidenţă
nefericită. DTD se referă numai la Document Type Definition. Într-un document XML
poate exista o singură declaraţie a tipului documentului, deci este introdusă chiar în
instanţa documentului. Deoarece pot fi combinate mai multe DTD-uri pentru a forma un
singur document, aceasta permite controlul încărcării DTD-urilor în fiecare document.
Declaraţia tipului documentului (DOCTYPE) are două părţi, ambele opţionale.
Prima se referă la un DTD extern, şi utilizează cuvinte cheie PUBLIC sau SYSTEM pentru
a identifica o intrare dintr-un catalog, respectiv un URI. În cazul în care cataloagele nu
sunt implementate în procesorul XML, se pot specifica ambele părţi deodată, fără cel de al
doilea cuvânt cheie:
Limbajul XML a fost proiectat astfel încât să fie transparent la utilizare pentru a putea fi
înţeles şi utilizat cu uşurinţă. Descrierile XML succinte sau complicate din majoritatea
documentelor sunt greu de înţeles în efortul de a fi explicit într-un mod în care
programatorii să îl poată translata cu uşurinţă în aplicaţii care să funcţioneze.
Un document XML este o colecţie de entităţi care pot fi sau nu analizate. Datele
care nu sunt înţelese de un procesor XML, date binare sau date care au sens numai
pentru alte aplicaţii, reprezintă date neanalizate. Datele înţelese de XML, fie ca şi
caractere fie ca marcaje, sunt date analizate. Un document XML trebuie să fie construit
corect.
Cea de a doua parte opţională a declaraţiei DOCTYPE permite introducerea submulţimii
interne a unui DTD direct în document. Există restricţii severe cu privire la genul de
informaţie care poate fi introdusă în DTD-ul intern, dar oricum se pot face destul de multe.
Submulţimea internă a unui DTD este încadrată între paranteze drepte, astfel:
De asemenea, cele două pot fi combinate, permiţând adăugarea anumitor tipuri de
declaraţii şi entităţi aproape în orice mod:
Pentru claritate, submulţimea internă este evidenţiată ca mai jos:
(a) (b) (c) Definirea corpului documentului
Un document XML este alcătuit din text, care de obicei este format din mai multe marcaje
şi date caracter. Prologul conţine numai marcaje, dar nu aceasta este partea interesantă,
deoarece este nevoie de date care să însoţească marcajele care, altfel, nu ar fi decât nişte
cutii goale. Corpul documentului conţine aproape tot ceea ce contează din perspectiva unei
aplicaţii împrăştiate generos în cadrul marcajelor.
Un DTD poate declara multe tipuri de date care să poată fi utilizate într-un document, dar
tipul de date prestabilit este întotdeauna CDATA, pentru date obişnuite de tip caracter.
Foaia sau manualul de codare indică ce tip de dată poate fi introdus în fiecare atribut sau
câmp cu conţinut element. Presupunând că tipul de date este CDATA, în câmp se poate
pune aproape orice se doreşte atât timp cât nu conţine un marcaj în afara unei secvenţe
escape. Marcajul este format din ansamblu de date non-caracter dintr-un fişier XML.
Diversele forme pe care le poate lua un marcaj sunt prezenţate în tabelul următor:
<!DOCTYPE nume-document PUBLIC “{catalog id}”>
<!DOCTYPE nume-document PUBLIC “{catalog id}” “{uri}”>
<!DOCTYPE nume-document SYSTEM “{uri}”>
<!DOCTYPE nume-document [ {declaraţiile DTD-ului intern} ]>
<!DOCTYPE nume-document PUBLIC “{catalog id}” “{uri}” [ {declaraţiile DTD-ului
intern} ]>
<!DOCTYPE nume-document PUBLIC “{catalog id}” “{uri}” [
{declaraţiile DTD-ului intern}
]>
Tabel cu sintaxa marcajului XML
Eticheta de pornire <numeElement [atribute]>....
Eticheta de terminare ...</numeElement>
Eticheta definire element vid <numeElement [atribute]/>
Referinţa entitate &numeEntitate; sau%parametru_nume_entitate
Referinţa caracter &#numarzecimal;
comentariu <!—comentariu - ->
Delimitatoare sectiune
CDATA
<![CDATA[ informatii cdata]]>
Declaratiile tipului
documentului
<!DICTYPE nume idextermen? [informatii
DTP]>
Instructiuni de prelucrare <?Idprocesor date?>
Declaratia XML <?xml version encoding standalone?>
Marcajul începe întotdeauna fie cu caracterul <, caz în care se încheie întotdeauna cu
caracterul >, fie cu caracterul &, caz în care se încheie întotdeauna cu caracterul “;”.
(d) Formarea structurilor logice în XML
Imbricarea elementelor este singurul mecanism utilizat pentru a arăta structura logică
dintr-un document XML. Etichetele de pornire şi încheiere din fluxul de text spun
procesorului XML că a fost întâlnit un nod. Dacă procesorul XML întâlneşte o altă
etichetă de pornire înainte de eticheta de încheiere corespunzătoare, atunci procesorul ştie
că acesta este fie un nod nou în arbore, fie o frunză. Dacă nu găseşte o nouă etichetă de
pornire şi întâlneşte o etichetă de încheiere, atunci procesorul ştie că aceasta este o frunză
şi că poate acţiona iterativ la acel nivel al arborelui până când întâlneşte o altă etichetă de
pornire sau de încheiere. Prelucrarea acţionează treptat, bazându-se pe această regulă
simplă. Dacă procesorul validează documentul, atunci fiecărui nod i se poate asocia o
regulă care să determine ce tip de conţinut poate apărea în el. O etichetă vidă este, prin
definiţie, o frunză, deoarece nu poate avea nici un conţinut.
Etichetele cu conţinut trebuie să aibă o etichetă de pornire şi o etichetă de încheiere.
Eticheta de pornire conţine numele elementului încadrat între paranteze unghiulare, având
opţional atribute ca argumente. Eticheta de încheiere conţine numele elementului precedat
de caracterul slash, totul fiind încadrat între paranteze unghiulare. În eticheta de încheiere
nu puteţi trece atribute.
Codul următor reprezintă o etichetă cu conţinut:
În XML sunt utilizate două tipuri de etichete, etichete cu conţinut şi etichete vide.
Seamănă mult cu etichetele HTML standard şi nu ar trebui să ridice alte probleme în afara
celei de construire corectă, care cere ca ele să se imbrice într-adevăr una în cealaltă. Nu
pot exista etichete care să alterneze între ele ca în acest exemplu greşit construit:
Cu toate că este o eroare obişnuită în HTML, XML este cu mult mai pretenţios şi nu
va permite această construcţie. Etichetele trebuie imbricate corect, după cum se vede în
exemplul următor:
Acum etichetele sunt imbricate corect. Trebuie închisă fiecare etichetă care începe
în contextul unei anumite etichete (sau a mai multor etichete) înainte de închiderea
contextului etichetei respective.
Etichetele vide au disponibil un format special, cu toate că aceeaşi schemă, etichetă
de pornire/ etichetă de încheiere, poate fi utilizată atâta timp cât se ţine cont de faptul că nu
trebuie pus nici un fel de conţinut între eticheta de pornire a elementului vid şi eticheta de
încheiere care urmează imediat după ea. De asemenea, poate exista preocuparea că este
posibil ca documentul XML să fie vizualizat cu un browser Web obişnuit, deoarece
etichetele de încheiere pentru elementele care arată ca etichete HTML vide pot duce la
blocarea browserului sau la un comportament ciudat al acestuia. Totuşi, pentru utilizare
generală, formatul special este mnemonic în sine, un avantaj deoarece se poate vedea că
eticheta este vidă şi nu blochează aproape nici un browser. De obicei, etichetele vide sunt
pornite şi încheiate în cadrul aceleiaşi perechi de paranteze unghiulare, plasând după
numele elementului şi toate atributele sale posibile un spaţiu, un caracter slash şi apoi
paranteza unghiulară închisă:
Fiecare element dintr-un document XML valid a fost definit în DTD-ul asociat acelui
document prin declaraţia DOCTYPE. DTD-ul declară următoarele:
<titlu subtitlu=‘‘o excursie” >dus-întors</titlu>
<bold><italic>text ingrosat şi inclinat</bold></italic>
<image source=‘‘imagine.jpeg” type=‘‘JPEG” />
<bold><italic> text ingrosat şi inclinat </italic></bold>
(e) Entităţi neanalizate
O entitate neanalizată este orice lucru care nu poate fi recunoscut de un procesor XML, fie
date binare, cum ar fi un fişier imagine sau audio, fie text care trebuie să fie transferat unei
aplicaţii fără a fi prelucrat în vreun fel. HTML utilizează comentarii pentru a ascunde un
astfel de text de browserul HTML, dar XML are câteva mecanisme care funcţionează mult
mai sigur.
O entitate neanalizată trebuie mai întâi să fie declarată ca NOTATION, o declaraţie
specială care numeşte o aplicaţie de asistenţă care ştie cum să lucreze cu entităţi de un
anumit tip. Notaţiei îi este dat un nume, un identificator public opţional şi apoi numele mai
puţin opţional al aplicaţiei de asistenţă, ca în una din variantele următoare:
Prima opţiune funcţionează numai dacă există un catalog. Nu se poate pune baza pe un
catalog deoarece acesta funcţionează indiferent dacă există sau nu catalog. Nu se poate
baza pe un catalog deoarece acesta este un instrument SGML pe care multe procesoare
XML actuale l-au moştenit implicit de la predecesoarele lor SGML. Studierea catalogului
nu este specificată în recomandarea W3C şi nu se poate conta niciodată pe ea. Dacă este
posibil, se recomandă utilizarea ultimele două versiuni. Pe de altă parte, codarea hard a
informaţiilor despre locaţia şi identitatea aplicaţiei de asistenţă în absolut fiecare DTD este
un anacronism predispus la erori pe Web.
Section 8.03 4.4 XML-ul ca bază de date
numele efective ale elementelor,
regulile utilizate pentru a determina care elemente se pot imbrica în alte elemente
şi în ce ordine,
atributele posibile şi valorile lor prestabilite sau constante,
valorile caracter ale tipurilor enumerate,
entităţile neanalizate utilizate în document şi modul în care sunt referite prin
nume,
codificările de limbă utilizate în document,
alte informaţii importante pentru prelucrarea şi redarea documentului.
<! NOTATION nume-mnemonic PUBLIC “identificator-public”>
<! NOTATION nume-mnemonic PUBLIC “identificator-public” “nume-
aplicaţie.exe”>
<! NOTATION nume-mnemonic SYSTEM “nume-aplicaţie.exe”>
Având formatul unei baze de date documentele XML prezintă anumite avantaje. De
exemplu, este auto-descris (tag-urile descriu structura şi numele tipurilor de date, dar nu şi
semantica), este portabil (Unicode), şi poate descrie date în structuri de arbori sau grafuri.
De asemenea are şi dezavantaje. De exemplu, este prolixs(neclar) şi accesul la date este
greoi datorită analizării şi conversiei textului.
Astfel, se pot folosi documente XML ca o bază de date într-un mediu cu cerinţe
modeste şi date puţine, dar această soluţie nu este viabilă într-un mediu pentru producţie în
masă, unde există mulţi utilizatori, cerinţe stricte de integritate a datelor şi nevoia de o
performanţă bună.
Cel mai important factor în alegerea unei baze de date este ce va stoca aceasta: date sau
documente?. XML-ul poate fi folosit doar pentru a transporta date între baza de date şi o
aplicaţie sau poate fi folosit integral ca în cazul documentelor XHTML şi DocBook.
Scopul utilizării XML este important deoarece toate documentele centrate pe date au
anumite caracteristici comune, la fel se întâmpla şi în cazul informaţiilor centrate pe
documente, şi aceste caracteristici influenţează felul cum XML-ul este stocat în baza de
date. Documentele centrate pe date sunt documente care folosesc XML-ul pentru
transportul datelor. Aceste documente sunt folosite de către aplicaţii şi nu are nici o
importanţă faptul că informaţiile folosite au fost reţinute pentru o perioadă de timp în
documente XML. Exemple de documente centrate pe date sunt ordine de plată,
programarea zborurilor, date ştiinţifice.
Un document XML este o bază de date în sensul cel mai strict al cuvântului şi anume
este o colecţie de date. Se poate considera că aceste documente nu sunt diferite de orice
alt tip de fişiere – în fond, toate fişierele conţin anumite tipuri de date.
Putem considera şi că XML şi tehnologiile asociate constituie o bază de date în
sensul mai larg al cuvântului – adică, un sistem de gestiune a bazelor de date (SGBD).
XML oferă multe din avantajele bazelor de date: stocare (documente XML), scheme
(DTD-uri, scheme XML, RELAX NG, ş.a,), limbaje de interogare (XQuery, XPath,
XQL, XML-QL, QUILT, etc.), interfeţe de programare (SAX, DOM, JDOM). Totuşi
multe componente ale bazelor de date convenţionale: stocare eficientă, indecşi,
securitate, tranzacţii şi integritatea datelor, accesul multi-user, triggere, interogări făcute
pe mai multe documente ş.a.
Informaţiile care există în documentele centrate pe date pot proveni din baza de date (caz
în care se doreşte extragerea lor în fişiere XML), dar şi din afara bazei de date (caz în care
se doreşte stocarea acestora în baza de date). Un exemplu de informaţii care provin dintr-o
bază de date sunt cantităţile de date stocare în bazele de date relaţionale, iar un exemplu de
informaţii care se doresc a fi introduse într-o bază de date pot fi considerate datele
ştiinţifice obţinute de un sistem de măsurători şi convertite în XML.
Următorul model este un document centrat pe date:
<OrdinVanzari NumarOV=‘‘35442”>
<Client NumarClient=‘‘423”>
<NumeClient>Alfa 123</NumeClient>
<Strada>Calea Vacaresti.</Strada>
<Oras>Bucuresti</Oras>
<Sector>IL</Sector>
<CodPostal>0040</CodPostal>
</Client>
<DataOrdin>20032009</DataOrdin>
<Item NumarItem=‘‘1”>
<Parte NumarParte=‘‘123”>
<Descriere>
<p><b>caiet cu sina:</b><br />
Hartie alba,
garantie</p>
</Descriere>
<Pret>122</Pret>
</Parte>
<Cantitate>110</Cantitate>
</Item>
<Item NumarItem=‘‘2”>
<Parte NumarParte=‘‘4516”>
<Descriere>
<p><i>Separator:</i><br />
Aluminiup>
</Descriere>
<Pret>533</Pret>
</Parte>
<Cantitate>130</Cantitate>
</Item>
</OrdinVanzari>
Documente centrate pe date au o structură regulată, datele sunt atomice (cea mai
mică unitate independenta de date este un element sau un atribut). Ordinea elementelor
care apar în document nu este importantă, decât în momentul validării documentului.
Pe lângă documentele centrate pe date, cu structura asemănătoare cu documentul din
exemplul anterior, multe documente care conţin şi text adiţional sunt centrate pe date. Spre
exemplu, să considerăm o pagină web care conţine informaţii despre o carte. Deşi pagina
conţine în mare parte text, structura acelui text este regulată, şi o parte din acel text este
comună tuturor paginilor care descriu cărţi, fiecare porţiune de text specific având
dimensiuni limitate. Astfel pagina ar putea fi construită dintr-un document XML simplu,
centrat pe date care conţine informaţii despre o singură carte şi este obţinut dintr-o bază de
date şi un stylesheet XSL care adaugă textul care leagă informaţiile din XML. În general
orice site web care construieşte documente HTML dinamic prin completarea unui template
cu informaţii dintr-o bază de date poate fi înlocuit cu mai multe documente XML centrate
pe date şi unul sau mai multe stylesheet-uri XSL.
4.5 Date, documente şi baze de date
Totuşi, aceste reguli nu sunt stricte. Datele, în special datele semistructurate, pot fi
stocate în baze de date native XML şi documentele pot fi stocate în baze de date
tradiţionale, atunci când nu sunt necesare foarte multe caracteristici specifice XML. În
plus, graniţele dintre bazele de date tradiţionale şi cele native XML devin din ce în ce mai
neclare, deoarece la bazele de date tradiţionale se adaugă facilitaţi native XML şi bazele
de date native XML suportă stocarea fragmentelor de documente în baze de date, de obicei
relaţionale, externe.
Pentru transferarea datelor între documente XML şi o bază de date, este necesară
maparea schemei documentului XML (DTD, Scheme XML, RELAX NG, etc.) pe schema
bazei de date. Software-ul pentru transferul de date este construit peste această mapare.
Software-ul poate folosi un limbaj de interogare XML (cum ar fi XPath, XQuery) sau
poate transfera direct date conform cu maparea (echivalentul în XML al interogării
SELECT * FROM Tabelă).
În al doilea caz, structura documentului şi structura necesară pentru mapare trebuie
să fie identice. Deoarece acest lucru se întâmplă destul de rar, produsele care folosesc
această strategie sunt adesea folosite împreună cu XSLT. Astfel, înainte de transferarea
datelor în baza de date, documentul este întâi adus la structura necesară mapării şi apoi
datele sunt transferate. Similar, după transferarea datelor din baza de date, documentul
obţinut este adus la structura folosită de către aplicaţie.
De obicei, datele sunt stocate într-o bază de date tradiţională cum sunt cele
relaţionale sau orientate-obiect. Documentele sunt stocate într-o bază de date nativă
XML (o bază de date destinată stocării XML) sau un sistem de gestionare a
conţinuturilor (content management system) – o aplicaţie destinată administrării
documentelor şi construită peste o bază de date nativă XML.
Maparea, bazată pe tabele, este folosită de multe produse care efectuează transferul de date
între un document XML şi o bază de date relaţională. Aceasta modelează un document
XML ca o singură tabelă sau ca un set de tabele. Structura documentului XML este arătată
în exemplul
Mapările între schemele documentelor şi schemele bazelor de date sunt efectuate
pe tipurile elementelor, atribute, şi text. Aproape întotdeauna, se omit structurile fizice
(cum ar fi entităţile şi informaţia codificată) şi unele structuri logice (cum ar fi
instrucţiunile de procesare, comentariile). Aceste omiteri nu au o influenţă prea mare,
deoarece baza de date şi aplicaţia sunt interesate numai de datele din documentul XML.
următor.
<bazadedate>
<tabela>
<linie>
<coloana1>...</coloana1>
<coloana2>...</coloana2>
...
</linie>
<linie>
...
</linie>
...
</tabela>
<tabela>
...
</tabela>
...
</bazadedate>
În funcţie de software datele din coloane pot fi stocate ca elemente descendente sau ca
atribute. În plus, produsele care folosesc mapări bazate pe tabele de multe ori includ
metadate fie la începutul documentului fie ca atribute asociate fiecărui element din tabelă
sau coloană. Maparea, bazată pe tabele, este utilizată pentru serializarea datelor
relaţionale, ca în cazul transferării datelor între două baze de date relaţionale. Dezavantajul
acestei mapări este că nu poate fi folosită pentru un document XML care nu respectă
formatul din exemplu. Instanţierea obiectelor din model depinde de produsul folosit. Unele
produse dau posibilitatea generării claselor în model şi apoi, folosirea obiectelor din aceste
clase în aplicaţii. În cazul folosirii acestor produse, datele sunt transferate între documentul
XML şi aceste obiecte, şi între aceste obiecte şi baza de date. Alte produse folosesc aceste
obiecte numai pentru a vizualiza maparea şi transferul de date direct între documentul
XML şi baza de date.
Modul în care maparea obiectual-relaţională este suportată variază de la produs la
produs. De exemplu:
toate produsele suportă maparea tipurilor complexe de elemente pe clase şi a
tipurilor simple de elemente şi atribute pe proprietăţi.
toate produsele dau posibilitatea desemnării unui element rădăcină care nu este
mapat pe modelul obiect sau pe baza de date. Acest element este folositor atunci
când se doreşte stocarea obiectelor cu mai multe nivele în acelaşi document XML.
majoritatea produselor oferă posibilitatea specificării dacă proprietăţile sunt mapate
pe atribute sau pe elemente descendente în documentul XML. Unele produse permit
combinarea atributelor cu elementele descendente; altele cer folosirea numai a
elementelor descendente sau a atributelor.
majoritatea produselor permit folosirea numelor diferite în documentul XML şi baza
de date, dar sunt anumite produse care necesită folosirea aceloraşi nume atât în
documentul XML cât şi în baza de date.
majoritatea produselor permit specificarea ordinii în care elementele descendente
apar în părintele lor, dar care face imposibilă construirea mai multor modele pentru
conţinut. Din fericire, modelele pentru conţinut suportate sunt suficiente pentru
majoritatea documentelor centrate pe date (ordinea este importantă numai dacă se
face validarea documentului).
multe produse transferă date direct conform cu modelul pe care sunt construite.
La fiecare tabelă pentru care cheia primară este exportată, se adaugă un element
descendent la model şi se procesează tabela recursiv.
O schema XML se generează dintr-o schemă relaţională astfel:
pentru fiecare tabelă se generează un tip de element
pentru fiecare coloană care nu este cheie în acea tabelă, dar şi pentru coloanele
chei primare, se adaugă la model un atribut la tipul elementului sau un element
descendent ce conţine numai PCDATA.
Pentru fiecare cheie străina, se adaugă un element descendent la model şi se procesează
tabela cu cheie străină recursiv. Există câteva dezavantaje la aceste procedee. Multe dintre
acestea se pot corecta uşor de către programator, cum ar fi coliziuni de nume şi
specificarea lungimilor şi tipurilor de date ale coloanelor. DTD-urile nu conţin informaţii
despre tipurile de date, deci nu este posibilă cunoaşterea tipurilor de date care ar trebui
folosite în baza de date. Tipurile de date şi lungimile pot fi prevăzute dintr-o schemă
XML.
O problemă mai importantă este aceea că modelul de date folosit de documentul
XML este adesea diferit şi de obicei mai complex decât cel mai eficient model pentru
stocarea datelor în baza de date. De exemplu, se consideră următorul fragment XML:
Procedura pentru generarea unei scheme relaţionale dintr-o schemă XML ar crea
două tabele: una pentru clienţi şi una pentru adrese. Totuşi, în majoritatea cazurilor, ar fi
mai bine să se reţină adresa în tabela de clienţi, şi nu într-o tabelă separată.
Elementul <Adresa> este un bun exemplu pentru un element wrapper. Elementele
wrapper sunt în general folosite din două motive. În primul rând, ele oferă structuri
adiţionale ceea ce face documentul mai uşor de înţeles. În al doilea rând, ele sunt de obicei
folosite ca o formă de redactare a datelor. De exemplu, elementul <Adresa> ar putea fi
trimis la o rutină care transformă toate adresele în obiecte Adresa, indiferent unde apar
acestea.
Daca elementele wrapper sunt folositoare în XML, în general ele cauzează probleme
atunci când sunt mapate la baza de date dacă acestea se găsesc sub forma extra-
<Client>
<Nume>ABC </Nume>
<Adresa>
<Strada>Calea Vacaresti.</Strada>
<Sector>1</Sector>
<Tara>Romania</Tara>
<CodPostal>0040</CodPostal>
</Adresa>
</Client>
structurilor. Din această cauză, ele ar trebui eliminate din schema XML înaintea generării
schemei relaţionale. Din moment ce este puţin probabil că modificarea schemei XML ar
trebui să fie permanentă, acest lucru duce la o neconcordanţă între documentul existent şi
documentele presupuse de către soft-ul de transfer de date, din moment ce elementele
wrapper nu sunt incluse în mapare. Acest lucru poate fi rezolvat prin transformarea
documentelor la rulare cu XSLT: elementele wrapper sunt eliminate înaintea transferării
datelor în baza de date şi sunt inserate după transferul datelor din baza de date.
Cu toate aceste dezavantaje, procedurile de mai sus oferă în continuare un punct de
pornire folositor pentru generarea schemelor XML din scheme relaţionale şi invers, în
special în sisteme mari.
Pentru stocarea documentelor XML există două strategii de bază: stocarea lor în sistemul
de fişiere sau ca un BLOB într-o bază de date relaţională şi acceptarea funcţionalităţilor
XML limitate, sau stocarea lor într-o bază de date nativă XML.
Dacă se lucrează cu un set simplu de documente, cum ar fi un set mic de documentaţie,
cea mai uşoara cale de stocare este în sistemul de fişiere. Se pot folosi instrumente cum ar
fi ‘‘grep” pentru interogarea lor, şi ‘‘sed” pentru modificarea lor. Căutările complete de
text în documentele XML sunt inexacte, pentru că ele nu pot distinge marcajul de text şi
nu pot înţelege folosirea entităţilor. Totuşi, într-un sistem mic, aceste inexactităţi ar putea
fi acceptabile. Dacă se doreşte un simplu control al tranzacţiilor, documentele pot fi
întreţinute cu o versiune de control a sistemului cum ar fi CVS sau RCS.
(a) (b) 4.6 Stocarea documentelor în BLOB-uri
O opţiune puţin mai sofisticată este stocarea documentelor ca BLOB-uri într-o bază de
date relaţională. Această modalitate oferă un număr de avantaje a bazelor de date:
controlul tranzacţiilor, securitate, acces multiuser. În plus, multe baze de date au
instrumente pentru căutări de text şi pot face căutări complete de text, căutări
aproximative, căutări sinonime şi căutări fuzzy. Unele dintre aceste instrumente sunt
construite pentru a recunoaşte XML, ceea ce va elimina problemele care apar la căutările
documentelor XML ca simplu text.
Atunci când se stochează documente XML ca BLOB-uri, se pot implementa uşor
indexări simple care recunosc XML, chiar dacă baza de date nu poate indexa XML. O
modalitate de a face acest lucru este crearea a două tabele, o tabelă index şi o tabelă
document. Tabela document conţine o cheie primară şi o coloană BLOB în care este
reţinut documentul. Tabela index conţine o coloană în care se găseşte valoarea ce va fi
indexată şi o cheie străină care duce la cheia primară a tabelei document.
Atunci când documentul este stocat în baza de date, el este căutat pentru toate
instanţele elementului sau atributului care este indexat. Fiecare instanţa este stocată în
tabela index, împreuna cu cheia primara a documentului. Coloana de valori este apoi
indexată, şi permite unei aplicaţii să efectueze o căutare rapidă a unei anumite valori a
unui element sau atribut şi să recupereze documentul corespunzător.
Când se inserează o broşură în baza de date, aplicaţia inserează broşura în tabela Broşuri,
apoi caută elementele <Autor>, reţinând valorile acestora şi ID-ul broşurii din tabela
Autori. Aplicaţia poate recupera broşurile în funcţie de autor cu o simplă fraza SELECT.
De exemplu, pentru a recupera toate broşurile scrise de autorul ‘‘ION”, aplicaţia execută
următoarea interogare:
Unele baze de date native XML pot include date aflate la distanţă în documente stocate în
baza de date.
De exemplu, se consideră un set de documente cu următorul DTD şi se doreşte
construirea unui index de autori:
<!ELEMENT Brosura (Titlu, Autor, Continut)>
<!ELEMENT Titlu (#PCDATA)>
<!ELEMENT Autor (#PCDATA)>
<!ELEMENT Continut (%Inline;)> <!-- Inline entity from XHTML -->
Acestea ar putea fi stocate în următoarele tabele:
Autori Brosuri
---------------------- ---------
Autor VARCHAR(50) BrosurID INTEGER
BrosuraID INTEGER Brosura LONGVARCHAR
SELECT Brosura
FROM Brosuri
WHERE BrosuraID IN (SELECT BrosuraID FROM Autori WHERE Autor= 'ION')
(c) Sisteme de management ale conţinuturilor
Sistemele de management ale conţinuturilor sunt un alt tip specializat de baze de date
native XML. Acestea sunt proiectate pentru operarea cu documente scrise de oameni, cum
ar fi manualele de utilizare, şi sunt construite peste baze de date native XML. Baza de
date, este în general, ascunsă de utilizator în spatele unui ‘‘front end” care oferă
caracteristici, precum:
Termenul de sistem de management al conţinuturilor, spre deosebire de sistem de
management al documentelor, reflectă faptul că asemenea sisteme permit, în general,
împărţirea documentelor în fragmente cu conţinut discret, cum ar fi exemple, proceduri,
capitole, dar şi metadate cum ar fi numele autorilor, datele reviziilor, şi numerele
documentelor, decât să opereze cu fiecare document ca un întreg. Nu numai că, astfel se
simplifică coordonarea lucrului mai multor scriitori la acelaşi document, dar permite şi
asamblarea unor documente noi din componente care există deja.
Feed-urile RSS sunt de obicei folosite pentru a oferi conţinut sau porţiuni de conţinut
(articole, mesaje, ştiri, anunţuri, etc) într-un format standard, care poate fi preluat de
aplicaţii specializate (gen browsere, editoare de ştiri, roboţi de căutare, etc) şi afişate apoi
destinatarului. Decât să verificăm în fiecare oră ce a mai apărut nou pe paginile preferate,
De obicei, aceste date sunt recuperate dintr-o bază de date relaţională cu ODBC, OLE
DB, sau JDBC şi sunt modelate folosind maparea bazată pe tabele sau maparea
relaţional-obiectuală. Daca aceste date sunt “live”, adică dacă actualizările
documentului din baza de date nativă XML sunt reflectate în baza de date aflată la
distanţă – depinde de baza de date nativă XML. În viitor, majoritatea bazelor de date
native XML vor suporta date “live” aflate la distanţă.
control al versiunilor şi al accesului;
motoare de căutare;
editoare XML/SGML;
motoare de publicare pe hârtie, CD sau pe Web;
separarea conţinuturilor şi a stilurilor;
extinderea în scripturi şi programare;
integrarea datelor din baza de date.
Ce este RSS?
folosiţi o aplicaţie care va afişa noutăţile direct când apar. Un fişier RSS este scris în meta-
limbajul de marcare XML (eXtensible Markup Language), extensia fişierului este .rss sau
.xml (dar poate fi şi .html sau .php, dar atunci nu este nestandard) iar tipul MIME al
fişierului trebuie să fie application/rss+xml. Pentru a introduce un fişier RSS în paginile
unui site trebuie specificat în partea de HEAD a documentului web următoarea linie,
unde pentru href trebuie specificat calea către fişierul RSS. Astfel spunem browserului sau
aplicaţiei (client) de unde să citescă informaţiile.Se poate face referire la un feed RSS şi
printr-un link direct (de obicei se foloseşte o poză standard pentru RSS) iar în acest caz
vizitatorul este invitat să dea click pe acea imagine pentru a prelua feed-urile oferite de
acea pagină web. În interiorul unui feed-RSS se găsesc itemuri (obiecte). Orice fişier RSS
trebuie să conţină cel puţin un item. Item-urile sunt în general paginile web care dorim să
le dăm către alţi vizitatori. De exemplu, doriţi să informăm cititorii de apariţia unui nou
articol pe site. Informaţia despre acea pagină va forma un item. Pentru a introduce un item
în fişierul RSS va trebui să completăm elementele: Titlul- Descrierea- LinkTitlul. Fişierele
XML utilizează taguri pentru a specifica titlul, descrierea şi linkul.
Deci, un feed-RSS este format dintr-o serie de iteme, iar acestea sunt legate împreună
pentru a crea un "Canal". Canalul apare la începutul fişierului şi la fel ca itemurile,
canalele utilizează titlul, descrierea şi linkul pentru a descrie conţinutul. De asemenea
trebuie să indicaţi ce tip de document este, introducând pentru aceasta tagurile pentru
document de tip XML şi RSS. Sfârşitul fişierului va arăta ca în exemplul următor:
Exemplu pentru descrierea unui item: <item>
<title>Titlul articol1</title>
<description>Descrierea articolului 1 </description>
<link>http://www.legatura_catre_pagina_articolului1.ro</lin
k>
</item>
<item>
<title>Titlu2 articol </title>
<description> Descrierea articolului 2 </description>
<link>http:/www.legatura_catre_pagina_articolului2.ro
</link>
</item>
<link rel="alternate" type="application/rss+xml" title="RSS"
Tema de casa.
- Creaţi un document XML cu structură minimală, pornind de la secvenţa de cod
(X)HTML data.
- Creaţi o schemă în care să reglementaţi scrierea unui document XML care să
înregistreze informaţii despre clienţii unei firme.
- Creaţi o schemă în care să reglementaţi scrierea unui document XML, care să
înregistreze informaţii despre conturile de useri şi calculatoare dintr-o reţea de
calculatoare.
<?xml version="1.0"?>
<rss version="2.0">
<channel>
<title>Titlul canalului </title>
<description>Explicatia</description>
<link>http://www.legatura_catre_pagina_articolului</link>
<item>
<title>Primul titlu</title>
<description>Descriere</description>
<link>http://www.legatura_catre_pagina_articolului</link>
</item><item>
<title>Titlul 2 </title>
<description>Descrierea</description>
<link>http://www.legatura_catre_pagina_articolului</link>
</item></channel> </rss>
STUDIU INDIVIDUAL.
Dezvoltarea si apelarea servleturilor
Un servlet este un cod de program Java care poate fi accesat printr-o interfață standard într-un
serviciu de rețea, asemenea programelor CGI aflate pe un site Web. Servleturile permit unui serviciu de
rețea, cum ar fi un server Web sau un server Ftp, să fie extins dinamic pentru a furniza noi facilități.
Unul din scopurile uzuale în care sunt folosite servleturile este de a crea o punte între un browser
Web și o bază de date încorporată; browserul Web se conectează la un server Web, care execută un
servlet care se conectează la baza de date și execută cererea browserului. Serverul Web nu trebuie să aibă
suport intern pentru accesul la baza de date; în schimb el poate fi dinamic extins cu servleturi care vor
executa aceste funcții. De fapt, servleturile sunt un mecanism potrivit pentru a implementa aproape orice
serviciu de acces în rețea.
Servleturile au mecanism curat pentru implemetarea unor funcții variate. Servleturile pot fi folosite în
locul tradiționalelor aplicații CGI, dar bineînteles cu îmbunătățirile aduse de limbajul de programare
Java. Servleturile întrec tradiționalul CGI, prin colaborarea între aplicații și prin îmbunătățirea
perfomanțelor. Servleturile pot de asemenea să fie folosite pentru a genera dinamic pagini HTML.
API-ul servlet-urilor
Toate servleturile trebuie să implementeze interfaţa Servlet. Această interfaţă descrie mecanismul
exact prin care serverul reţea va interacţiona cu servleturile, incluzând iniţializările, finalizarea şi
răspunsul procesului.
Detalii despre răspunsul fiecărui client sunt date de servlet prin intermediul interfeţei
“ServletRequest” (figura 1). Această interfaţă descrie proprietăţile generale ale cererii care a fost făcută
către servlet. Servletul rezolvă cererea şi apoi răspunde clientului prin intermediul interfeţei
ServletResponse. Această interfaţă are un mecanism pentru ca servletul să seteze tipurile de date pentru
răspuns şi să scrie în fişierul de ieşire acest răspuns.
Figura1. Model de servlet cerere/răspuns
Ciclul de viață al servlet-ului
Servletul API specificat defineşte ciclul de viaţă al servletului. Ciclul de viaţă începe când un
servlet este iniţializat, după care cererea este prelucrată, şi se termină atunci când servletul este distrus. În
general, un servlet este creat o singură dată, prima dată când clientul o cere. Înainte ca această primă
cerere să fie preluată, servletul este automat iniţializat de serviciul de reţea cu diferiţi parametrii
predefiniţi. Când serviciul de reţea decide să dezinstaleze servletul, este apelat un destructor, astfel încât
servletul să elibereze resursele pe care le-a ocupat (figura2).
Figura2. Ciclul de viață al servlet-ului
Parametrii Servlet-urilor
Sunt două mecanisme importante pentru a transmite informaţiile de configurare într-un
servlet. Parametrii de iniţializare sunt transmişi servletului atunci când acesta este încărcat prima
dată; ei sunt specificaţi într-o configuraţie suplimentară, separată de cea a servletului. Aceşti
parametrii sunt folosiţi pentru configurarea de informaţii generale, care se aplică tuturor cererilor.
Ei sunt de obicei configuraţi static de instrumentul de admistrare grafic, altfel pentru servleturile
SSI pot de asemenea să fie declarate într-un tag servlet in-line. Depizând de metoda folosită pentru
a invoca servletul, parametrii ceruţi pot fi de asemenea specificaţi într-o cerere. Dacă parametrii
sunt daţi în timpul execuţiei, spre deosebire de parametrii daţi în momentul iniţializării, pot fi
folosiţi pentru furniza informaţii particulare unei anumite cereri.
Din momentul în care serverele creează o instanţă a unui servlet pentru a prelua cereri distincte şi
uneori concurente, programatorul trebuie să se concentreze asupra siguranţei firelelor de execuţie pentru
ca tehnicile de sincronizare standard să fie folosite ca să se asigure că servletul preia cererile în siguranţă.
Toate potenţialele accesări concurente ale unui servlet vor face apelări concurente către metoda “service(
)”. Blocurile de cod din această metodă ar trebui să nu fie executate concurent, ele ar trebui sincronizate
cu lacătele respective.
Servlet Beans
Servlet beans sunt servleturi adăugate la specificaţiile JavaBeans. Un servlet bean are mai multe
avantaje faţă de servleturile standard. În primul rând, un servlet bean poate fi distribuit într-un fisier JAR
care conţine toate clasele şi resursele servletului. Fişierul servlet JAR este instalat deobicei în
subdirectorul servletbeans al serverului. Un al doilea avantaj este că serverul gazdă poate folosi
introspecţia pentru a accesa proprietăţile servletului în stilul JavaBean. Acest lucru permite ca servletul să
primească informaţii noi fără să fie reîncărcat. Serverele, cum ar fi Java Web Server, permit administrarea
grafică a proprietăţilor servlet bean prin intermediul acestui mecanism. Alt avantaj al servleturilor bean
este că serverul gazdă poate să le serializeze automat. Odată ce o proprietate a fost modificată, noul bean
poate fi automat serializat astfel încât schimbarea să fie efectuată. Următoarea dată când server-ul va
încărca servletul, el poate fi încărcat din fişierul .ser în loc să-l încarce din fişierul original JAR.
Acţiuni şi componente JavaBeans
Acţiunile sunt tag-uri JSP predefinite care folosesc varianta XML. Spaţiul de nume utilizat este
http://java.sun.com/JSP/Page şi de regulă se utilizează prefixul jsp.
Componente JavaBeans
Java, prin intermediul componentelor JavaBeans, oferă posibilitatea utilizării acestora de către
instrumente de editare a aplicaţiilor fără ca programatorul să intervină direct în codul acestora. Este
oferită şi facilitatea de reflexie, prin care putem determina atributele şi metodele unei clase.
Însă în cazul aplicaţiilor Web nu avem nevoie de toate facilităţile şi restricţiile dictate de JavaBeans.
Cele mai importante lucruri pe care trebuie să le cunoaştem despre componentele JavaBeans, în contextul
aplicaţiilor Web, sunt:
Constructor fără parametri. Dintre toţi constructorii clasei, trebuie să existe unul fără
parametri sau să nu definim niciunul, caz în care va fi creat automat constructorul implicit.
Nici un membru nestatic nu va fi public. Atributele nestatice vor fi declarate protected sau
private. Eventual se poate utiliza modificatorul de acces implicit (package). Pentru modificarea valorilor
se vor utiliza metode care să efectueze şi validări asupra datelor (de exemplu, atributul vârstă nu poate
avea o valoare negativă).
Utilizarea de metode setter şi getter pentru accesarea membrilor nestatici. De exemplu,
dacă avem atributul vârstă de tip int, pentru modificarea valorii vom avea o metodă cu prototipul void set
varsta int varstaNoua, iar pentru obţinerea valorii, int get Varsta(). Pentru obţinerea valorilor atributelor
de tip boolean se vor utiliza metode cu prefixul is, de exemplu, boolean is Batran() pentru atributul
batran.
Pentru a utiliza o componentă JavaBeans în aplicaţiile Web vom utiliza acţiunea
jsp: useBean. Aceasta posedă atributele din tabelul urmator:
Atribut Descriere
Id Stabileşte un identificator pentru a putea fi referit ulterior. Se va crea o
variabilă cu acest nume.
Scope Stabileşte domeniul de vizibilitate pentru componente. Valorile posibile
sunt page, request, session şi application. Implicit este page.
Class Numele complet al clasei (inclusiv numele pachetului).
beanName Numele componentei JavaBeans.
Type
Tipul variabilei care va fi creată. Poate coincide cu numele clasei (dat de
atributul class sau beanName), poate fi numele unei superclase a acesteia
sau numele unei interfeţe implementate.
În cazul în care o componentă cu acelaşi identificator există deja în domeniul de vizibilitate
specificat, se va utiliza respectiva componentă şi nu se va mai crea una nouă.
Nu vom utiliza niciodată simultan atributele class şi beanName. Acestea se exclud unul pe celălalt.
Declararea componentei: <jsp:useBean id="categ" class="ro.mag.Categorie" />
este similară cu: <% ro.mag.Categorie categ = new ro.mag.Categorie(); %>
Pentru setare, avem la dispoziţie acţiunea jsp:setProperty. Aceasta prezintă atributele din tabelul de
mai jos.
Atribut Descriere
name Numele componentei asupra căreia se operează.
property Numele proprietăţii (datei membre) pentru care se doreşte
actualizarea valorii.
param Valoarea datei membre va fi dată ca parametru paginii JSP cu
numele specificat de acest atribut.
value Indică valoarea care va fi atribuită datei membre specificate.
Componentele JavaBeans pot fi accesate şi în expresiile cuprinse între $ { şi }. Acestea vor fi
evaluate în momentul execuţiei şi se vor înlocui cu valorile rezultate.
<h3>$ {categ.denumire} </h3> <p style="color: ${opţiuni.culoare}">
Bine ai venit ${param.utilizator}!</p>
Expresiile de acest tip se pot utiliza şi în interiorul tag-urilor, dar şi la valoarea atributelor.
Interfața Servlet
Interfața Servlet defineste modurile standard prin care un server de reţea poate accesa un servlet.
Toate servleturile funcţionează sub paradigma cerere/raspuns; totuşi, des, servleturile menţin date
individuale despre clienţi deci nu sunt chiar aşa de statice cum sugerează interfaţa de bază.
Deşi toate servleturile trebuie numaidecât să implementeze această interfaţă, multe vor profita de
facilităţile date de mai multe implementări specifice a acestei clase cum ar fi “GenericServlet” ori
“HttpServlet”, şi astfel vor respecta API-ul acestor clase specifice.
Metode
Următoarele metode definesc interfaţa de bază a unui servlet:
void init(ServletConfig config) throws ServletException . Această metodă dă unui servlet o şansă
pentru a executa orice operaţii de startup cerute, înainte de a servi cererea. Exemple pot fi alocarea
memoriei, stabilirea conexiunii prin reţea, si altele. Această metodă este apelată o dată şi numai o dată şi
este terminată atunci când prima cerere este preluată. Cererile care sunt primite înainte ca metoda init() să
fie terminată vor fi blocate până când se va termina cu această metodă.
Parametrii ServletConfig conţin informaţii de iniţializare pentru servlet. Chiar dacă nu sunt folosiţi,
acest parametru ar trebui ţinut pentru a fi returnat de metoda getServletConfig(). Multe implementări
standard a interfeţei Servlet, cum ar fi GenericServlet, au grijă de acest lucru automat.
void service (ServletRequest request, ServletResponse) throws ServletException,
IOException. Metoda service() este apelată de către serviciul de reţea care găzduieşte servletul de
fiecare dată când clientul face o cerere către servlet. Servletul poate citi din cerere date şi parametrii prin
intermediul parametrului de tip ServletRequest, request, şi ar trebui să trimită răspunsul său înapoi prin
intermediul parametrului response de tip ServletResponse.
void destroy(). La un moment dat după ce un servlet a terminat de servit cererea, gazda poate
decide să descarce servletul. Pentru acest lucru se apelează metoda destroy().
Când un servlet este distrus, el trebuie să elibereze toate resursele pe care le deţine şi să salveze
orice informaţie care trebuie să fie ţinută permanent. Multe servleturi menţin conexiunile deschise cu
resurse cum ar fi baze de date, servere RMI, ori fişiere. Aceste resurse ar trebuie închise şi eliberate când
metoda destroy() este apelată.
ServletConfig getServletConfig(). Această metodă trebuie să întoarcă un obiect ServletConfig care
ar fi trebuit salvat de metoda init().
String getServletInfo(). Această metodă ar trebui să returneze informaţii generale despre
servleturi cum ar fi autor, versiune, si copyright.
Interfaţa SingleThreadModel
Implicit, o singură instanţă a unui servlet poate fi apelată pentru a prelua cereri multiple
concurenţiale. Asta înseamnă că în general, autorii de servleturi trebuie să aibă grijă de siguranţa firelor
de execuţie. Dacă se implementează interfaţa SingleThreadModel, API-ul servletului garantează că două
fire de execuţie nu vor executa concurenţial metoda service() în aceaşi instanta a unui servlet. Această
interfaţă nu are metode.
Intefaţa ServletConfig
Această interfaţă este folosită de un serviciu de reţea pentru a transmite informaţii de configurare
unui servlet atunci când este iniţializat. ServletConfig este transmis într-un servlet în metoda init() şi
poate fi accesat în timpul unei cereri cu metoda getServletConfig().
Interfaţa ServletRequest
Interfaţa ServletRequest descrie informaţiile cerute care sunt transmise către metoda service().
O cerere este alcătuită formal din trei părţi: Cererea URL, care se identifică cu obiectul cerut;
parametrii cererii, care au detalii despre cerere; şi corpul cererii, care este alcătuit din datele specifice
aplicaţiei cererii.
Interfaţa ServletResponse
Interfaţa ServletResponse descrie cum un răspuns poate fi întors clientului. Toate răspunsurile sunt
de tip MIME; un tip MIME este asociat cu un volum de date. Acest tip indică cum vor trebui interpretate
datele de către client.
Interfaţa ServletContext
Interfaţa definește un set de metode pe care un servlet le poate folosi pentru a comunica cu
containerul său. Prin această interfaţă, servletul poate înregistra evenimente importante şi poate accesa
informaţii specifice reţelei de care aparţine serverului.
Un context al unui servlet poate fi obţinut prin apelarea metodei getServletContext() în configuraţia
iniţială a servletului.
void log(String message). Această metodă înregistrează un eveniment servlet într-un fişier de
înregistrari a servletului.
void log(Exception ex, String message). Aceasta este o metodă folositoare pentru a înregistra
urma unei erori şi mesajele de eroare în fişierul de înregistrări al servletului.
void log(String message, Throwable throwable). Aceasta este varianta din JSDK.
Enumeration getServletName(). Această metodă întoarce o enumeraţie a numelor servleturilor
găzduite de server. În general nu trebuie folosită această metodă.
Servlet getServlet(String name) throws ServletException. Această metodă întoarce servletul cu
respectivul nume, ori null dacă nu este găsit. În general nu trebuie folosită această metodă.
String getRealPath(String Path). Această metodă transformă o cale virtuală folosind reguli
locale, şi întoarce calea fişierului dependent de platformă.
String getMimeType(String file). Această metodă întoarce tipul MIME al fişierului specificat, ori
null dacă nu este cunoscut.
String getServletInfo(). Această metodă întoarce informaţii despre serverul care găzduieşte
servletul, incluzând numele său, şi numarul versiunii.
Object getAttribute(String name). Această metodă întoarce un nume, un atribut dependent de
server. Această metodă poate fi folosită pentru ca să se obţină servicii specifice serverului.
Clasa HttpServlet
Atunci când se scrie un servlet care va fi invocat printr-o cerere Http, se va extinde aproape
întotdeauna clasa HttpServlet. Această clasă implementează multe detalii folositoare de preluare a
cererilor Http, şi are multe clase utilitare pentru primirea de cereri HTTP şi pentru trimiterea răspunsurilor
HTTP formatate corespunzător.
Clasa HttpServlet este o subclasă a clasei GenericServlet, şi că are toate facilităţile clasei respective.
Definirea metodelor HTTP Cererea clientului HTTP poate fi de două feluri : cerere simplă sau completă.
În general, programul trebuie să utilizeze cereri complete, în afara cazului în care se lucrează cu
HTTP, versiunea 0.9. Singura metodă care utilizează cererea simplă este GET, utilizată pentru a regăsi o
resursă. Sintaxa este : GET URI <CR/LF>
În schimb, o cerere completă începe cu o linie de cerere, <CR/LF>, apoi informaţia codificată sub
forma unui antet (optional), <CR/LF> şi corpul entităţii (optional). Linia de cerere are sintaxa :
Metoda Cerere-URI versiune-HTTP <CR/LF>
Diferenţa între o cerere simplă şi una completă este prezentă câmpului versiune HTTP şi
posibilitatea de a specifica mai multe cereri HTTP (nu numai GET, ci şi HEAD, POST, ...).
Metoda GET cere serverului Web să regăsească informaţia identificată de URI. Serverul obţine
resursa cerută de client utilizând adresa resursei. Metoda GET devine GET condiţional dacă mesajul
cerere trimis de client include un câmp antet If-Modified-Since. O metodă GET condiţional cere ca
serverul să transfere resursa specificată numai dacă a fost modificată de la data specificată în câmpul If-
Modified-Since. În cazul în care clientul a transferat deja obiectul şi a ascuns entitatea GET condiţional
reduce gradul de utilizare al reţelei pentru că nu mai este nevoie de un transfer inutil.
Metoda HEAD este similară lui GET, cu excepţia faptului că serverul nu returnează un corp de
entitate în răspuns. Aplicaţiile utilizează HEAD pentru a obţine informaţii (în special de antet) despre
resursa identificată de URI, fără a transfera corpul entităţii. Informaţia de antet (metainformatie) trebuie
să fie aceeaşi cu informaţia trimisă de server ca răspuns la o cerere cu metoda GET. Aplicaţiile utilizează
metoda HEAD pentru a testa validitatea, accesibilitatea şi modificările legăturilor hipertext.
Metoda POST cere serverului Web să utilizeze obiectul din cerere ca resursă identificată de URI în
linia de cerere. Deci clientul spune serverului Web “aceasta este noua sursă pe care o utilizaţi cu URI-ul
pe care vi l-am furnizat”. În majoritatea cazurilor, POST crează sau înlocuieşte o resursă asociată cu URI-
ul trimis cu metoda POST. Totuşi, un POST completat cu succes nu cere ca entitatea să fie resursa pe
serverul de origine (serverul care recepţionează cererea completă) sau să fie accesibilă pentru o viitoare
referinţă. Deci, e posibil ca acţiunea realizată de metoda HTTP POST să nu furnizeze o resursă
identificabilă prin URI. În acest caz, serverul va returna un cod de stare 200 (OK) sau 204 (fara continut),
depinzând de includerea (sau nu) în răspuns a unui obiect care să descrie rezultatul.
Dacă un client crează o resursă pe un server de origine, clientul trebuie să creeze un cod de stare
201 care conţine un obiect (text, HTML, ...) care descrie starea cererii.
Toate cererile HTTP POST necesită un câmp Content Length valid. Un server HTTP trebuie să
corespundă cu un cod de stare 400 (cerere eronata) dacă nu poate determina lungimea conţinutului
mesajului cerere.
Alte metode HTTP : CHECKIN, CHECKOUT, DELETE, LINK, PUT, SEARCH,
SHOWMETHOD, SPACEJUMP, TEXTSEARCH şi UNLINK. Acestea sunt mai puţin utilizate şi nu
toate serverele permit aceste metode.
Pentru furnizorii de servicii Web care oferă servicii bazate pe aplicaţii Web dinamice, aplicaţia este
cheia afacerii şi tehnologia folosită în serverul de aplicaţie poate avea un impact major asupra rezultatelor
obţinute în afacere.
Containerul Web este parte a unui server care gestionează servlets, Java Server Pages (JSP) pecum
şi alte componente Web. Această tehnologie a containerului Web joacă un rol vital în determinarea
performanţelor si capacităţii de adaptare a componentelor aplicaţiei Web. Există o legătură directă între
această tehnologie folosită de către dezvoltatori şi performanţa şi agilitatea aplicaţiilor. Compania Sun
susţine că serverul GlassFish este de departe mult mai extensibil, mai modular, mai uşor de folosit şi mai
adaptabil decât serverul de aplicaţii Apache Tomcat oferind în acelaşi timp performanţe foarte bune. Cu
suport pentru clustering, mesaje, servicii enterprise, precum şi alte caracteristici cheie care lipsesc în
Tomcat, şi cu suportul companiei Sun şi sprijinul unei mari şi înfloritoare comunităţi, GlassFish este o
alternativă superioară pentru cei care dezvoltă aplicaţii Web.
GlassFish este un server open source, dezvoltat de către Comunitatea GlassFish, care a fost lansat
de către compania Sun în anul 2005. În anul 2008 versiunea a doua a serverului (GlassFish v2) a atins
aproape 9 milioane de descărcări şi 300.000 de înregistrări. Versiunea actuală, GlassFish v3 Prelude,
oferă o arhitectură modulară în mod implicit, care permite dezvoltarea aplicaţiilor Web in mod rapid şi cu
suport pentru limbaje dinamice. Este o platformă excelentă pentru implementarea aplicaţiilor Web
susţinută de Java sau de limbaje dinamice, cum ar fi JRuby.
GlassFish Enterprise Server v2 împreună cu Java Enterprise Edition (EE) 5 adaugă un plus de
calitate opțiunilor disponibile pentru comunitatea open source ridicându-se totodată la standardele impuse
de către compania Sun.
Tomcat a fost dezvoltat la Apache, de către un grup de dezvoltatori de la Sun şi Jserv, iar codul
iniţial a venit de la Sun. A devenit implementare de referinţă pentru primele versiuni de servlets şi pentru
specificaţii JSP. Tomcat a jucat un rol vital în începutul dezvoltării aplicaţiilor de server oferite de Java.
A fost disponibil sub licenţă open source încă de la început şi a contribuit la sporirea popularităţii sale în
cadrul organizaţiilor de tip Enterprise.
În general, aplicaţiile care rulează pe Tomcat, vor rula neschimbate şi pe GlassFish. Cu toate
acestea există diferenţe importante care afectează în mod direct performanţele, scalabilitatea şi
productivitatea aplicaţiilor.
La toate nivelurile, GlassFish este pur și simplu o opțiune mult mai bună decât Tomcat atât pentru
dezvoltatori cât și pentru companii:
GlassFish este o colectie de containere Java EE, nu doar un Container Web.
GlassFish este mult mai extensibil și mai modular decât Tomcat și dezvoltatorii pot profita mult
mai ușor de capabilitățile acestuia, cum ar fi: mesaje, clustering, failover, gestionare de sesiuni, EJB,
JMS, JSR, etc.
Model bilet examen
1. Să se realizeze un script care contine un grup cu 2 butoane radio, care
schimbă culorile textului din pagina, prin selectarea succesiva a acestora
(1 pct).
2. Realizati un fisier css care contine minim 3 stiluri, fiecare cu minim 3
proprietati diferite (1 pct);
3. Realizati un fisier html, care contine un formular cu 2 casete de text, 3
checkbox-uri, 2 grupuri de butoane radio si o lista de selectie. Prin
apasarea butonului de tip “button” cu value=“afiseaza datele introduse”,
datele preluate din formular vor fi afisate in caseta “rezultat”, care va fi
de tip “textarea”. Se vor utiliza si stilurile din fisierul definit la punctul 2
(3 pct).
4. Creaţi un fişier php care preia toate datele din formularul precedent, cu
ajutorul butonului “submit” si le adauga in tabela “text” din baza de date
“aplicatie” (2 pct).
5. Realizaţi un script care utilizeaza obiectele document, window şi Date (2
pct).
