22. JavaScript i PHP

 

Índex

Dinamització dels documents HTML

Els documents construïts exclusivament amb els recursos del llenguatge HTML són estàtics; és a dir, es mostren sempre de la mateixa manera. Les possibilitats d'interacció de l'usuari són molt reduïdes, i es limiten als hipervincles i a la captació i tramesa de dades amb formularis. L'ús del CSS introdueix alguns elements de dinamisme, però d'efectes limitats a la presentació formal.

Hi ha diversos recursos per a la dinamització dels documents, que constitueixen veritables llenguatges de programació: permeten la interacció amb l'usuari i la captació de dades externes al document. Entre aquests en destaquen dos: el JavaScript, que actua en l'ordinador client (el que rep el document web) i el PHP, que actua en el servidor (el que emet el document web).

La inserció de determinats objectes, com els vistos en el tema 18, aporten dinamisme, però els documents portadors com a tals continues essent estàtics.

 

JavaScript

El JavaScript és un llenguatge de programació que s'aplica als documents HTML i els fa dinàmics. Com el CSS, els programes de JavaScript es poden aplicar de dues maneres: formant part del document HTML o externs a aquest i reclamats des de dins.

Amb el JavaScript es fa possible:

En aquest tema només podem un petit tast del que es pot fer amb el JavaScript i indicar els punts de contacte entre l'HTML i el JavaScript.

 

Què fa un programa de JavaScript?

A grans trets, els programes de JavaScript actuen de la manera següent:

 

Organització dels documents amb JavaScript

A grans trets l'organització d'un document amb JavaScript és la següent:

A HEAD s'inclouen les dades fixes inicials i les especificacions sobre la tasca requerida, generalment organitzades en forma de funcions:

També es poden incloure els programes en un document exterior; en aquest cas a HEAD ens limitem a reclamar-lo.

A BODY s'inclouen les referències a les funcions definides a HEAD o en el programa exterior, en els punts adequats per a ésser executades. La manera d'incloure les especificacions depèn del moment en què s'ha d'executar cada programa. Hi ha tres suposits bàsics:

a) Execució mentre el document es carrega; en aquest cas s'inclou, intercalat entre les etiquetes HTML,

Exemple

b) Execució en el moment just en què el document s'ha carregat (o descarregat) del tot. S'indica així:

Exemple

c) Execució quan l'usuari fa una determinada acció amb el cursor en un determinat element. La fórmula general és:

Exemple

En els casos b) i c) es fan servir uns atributs especials anomenats gestors d'esdeveniments, que fan de pont entre l'HTML i el JavaScript, i que han estat tipificats pel W3C. Els principals són

onload en concloure's la càrrega del document
onmouseover en posar el cursor damunt l'element
onmouseout en retirar el cursor de damunt l'element
onclick en fer clic damunt l'element
onchange en seleccionar en un select

 

Identificadors

Com ja sabem, els elements d'un document poden ésser identificats amb l'atribut name. Alguns programes de javaScript exigeixen aquesta identificació; però d'altres exigeixen un identificador diferent, id.

A la llarga totes les identificacions d'elements s'hauran de fer amb id, però en el seu estat actual els navegadors no ho permeten totalment.

 

Programació en el servidor: el PHP

En molts casos es fa necessària la manipulació de dades en el servidor. Alguns casos típics són els següents:

Per a aconseguir aquestes i altres actuacions semblants, el servidor ha d'estar proveït d'algun programa que processi les dades i generi els documents HTML de resposta.

Hi ha diversos programes que fan aquesta comesa: el CGI, l'ASP, el PHP...

En el document PHP hi ha contingut HTML, contingut PHP o una combinació de tots dos. En el cas de l'exemple que ve a continuació hi ha una combinació de tots dos; la part corresponent a PHP és la següent:

Exemple

 

 

Cursos de JavaScript i de PHP

 

Podeu consultar els cursos de JavaScript i PHP d'aquesta mateixa col·lecció.