Continguts:

INTRODUCCIÓ
Un script client-side és un programa que pot acompanyar un document HTML o bé pot estar inserit directament dins d'ell. El programa s'executa en la màquina client quan el document es carrega o en qualsevol altre moment, com per exemple quan s'activa un link. El suport d'scripts per part de l'HTML és independent del llenguatge d'script.

Els scripts ofereixen als autors un mitjà per a extendre els documents HTML d'una manera altament activa i interactiva. Per exemple:


Hi ha dos tipus d'scripts que els autors poden associar a un document HTML:

  1. Aquells que s'executen una vegada quan el document és carregat per l'agent d'usuari. Els scripts que apareixen dins un element SCRIPT s'executen quan el document és carregat. Per als agents d'usuari que no poden o que no suportaran scripts, els autors poden incloure un contingut alternatiu via l'element NOSCRIPT.
  2. Aquells que s'executen cada vegada que té lloc un event específic. Aquests scripts poden estar assignats a un nombre indeterminat d'elements via els atributs d'events intrínsecs.

Nota. En l'Annexe hi ha informació més detallada sobre l'ús d'scripts.
DISSENY DE DOCUMENTS PER A AGENTS D'USUARI QUE SUPORTEN SCRIPTS
L'element SCRIPT situa un script dins un document. Aquest element pot aparèixer tantes vegades com es vulgui en el HEAD o el BODY d'un document HTML.
Especificar el llenguatge d'script
Com que l'HTML no es basa en un llenguatge d'script específic, els autors dels documents han de comunicar explícitament als agents d'usuari el llenguatge de cada script. Això es pot fer a través d'una declaració per defecte o bé a través d'una declaració local.

El llenguatge d'script per defecte.

Els autors haurien d'especificar el llenguatge d'script per defecte per a tots els scripts d'un document mitjançant la inclusió de la següent declaració META en el HEAD:
   <META http-equiv="Content-Script-Type" content="tipus">
on "tipus" és un tipus de contingut (per ex., "text/tcl", "text/javascript", "text/vbscript", etc.) que identifica el llenguatge d'script.

En absència d'una declaració META, el llenguatge d'script per defecte es pot fixar amb una capçalera HTTP "Content-Script-Type":
	Content-Script-Type: tipus
on "tipus" torna a ser un tipus de contingut que identifica el llenguatge d'script.

Els agents d'usuari haurien de determinar el llenguatge d'script per defecte per a un document d'acord amb els següents passos (de més alta a més baixa prioritat):

  1. Si alguna de les declaracions META especifica el "Content-Script-Type", l'última de la seqüència de caràcters determina el llenguatge d'script per defecte.
  2. D'altra manera, si alguna de les capçaleres HTTP especifica el "Content-Script-Type", l'última de la seqüència de caràcters determina el llenguatge d'script per defecte.

Els documents que no especifiquen informació del llenguatge d'script per defecte i que contenen elements que especifiquen un script per servir un event intrínsec són incorrectes. Els agents d'usuari poden continuar intentant interpretar els scripts especificats incorrectament però no estan obligats a fer-ho. Les eines de desenvolupament haurien de generar informació del llenguatge d'script per defecte per ajudar als autors a evitar la creació de documents incorrectes.

Declaració local d'un llenguatge d'script.

S'ha d'especificar l'atribut type per a cada instància de l'element SCRIPT d'un document. El valor de l'atribut type per a un element SCRIPT sobreescriu el llenguatge d'script per defecte per a aquell element.

Ex.:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
   "http://www.w3.org/TR/REC-html40/strict.dtd">
<HTML>
<HEAD>
   <TITLE>Un document amb SCRIPT</TITLE>
   <META http-equiv="Content-Script-Type" content="text/tcl">
   <SCRIPT type="text/vbscript" src="http://lloc.com/vbcalc">
   </SCRIPT>
</HEAD>
<BODY>
   <SCRIPT type="text/javascript">
      ...codi JavaScript...
   </SCRIPT>
</BODY>
</HTML>
En aquest exemple el llenguatge d'script per defecte és "text/tcl". Hi ha un SCRIPT en la capçalera, l'script del qual es troba en un fitxer extern i està en el llenguatge d'script "text/vbscript". També hi ha un SCRIPT en el cos, el qual conté el seu propi script escrit en "text/javascript".

Referències a elements HTML des d'un script.

Cada llenguatge d'script té els seus propis convenis per a fer referència a objectes HTML des d'un script. L'especificació de l’HTML 4.0 no defineix un mecanisme estàndard per a fer referència a objectes HTML.

No obstant, els scripts haurien de fer referència a un element d'acord amb el nom que té assignat. Les màquines que processen scripts haurien de tenir en compte les següents regles de precedència quan identifiquin un element: un atribut name té precedència davant d'un atribut id si és que estan inicialitzats els dos. D'altra manera, es pot utilitzar l'un o l'altre.
Events intrínsecs
És possible associar una acció amb un cert nombre d'events que tenen lloc quan un usuari interactua amb un agent d'usuari. Cadascun dels "events intrínsecs" pren un valor que és un script. L'script s'executa sigui quan sigui que tingui lloc l'event per a aquell element. La sintaxi de les dades dels scripts depèn del llenguatge d'script.

Els elements de control tals com INPUT, SELECT, BUTTON, TEXTAREA i LABEL tots responen a certs events intrínsecs. Quan aquests elements no apareixen dins un formulari, poden utilitzar-se per a augmentar la interfície gràfica d'usuari del document (per ex., els autors poden voler incloure botons de prémer en els seus documents, els quals no sotmetin cap formulari però que continuïn comunicant-se amb un servidor quan s'activin).

Ex.1:
   <INPUT NAME="nomUsuari" onblur="validarnomUsuari(this.value)">
Aquí, "nomUsuari" és un camp de text obligatori. Quan un usuari intenta abandonar aquest camp, l'event onblur crida una funció JavaScript per confirmar que "nomUsuari" té un valor acceptable.

Ex.2:
<INPUT NAME="num"
   onchange="if (!checkNum(this.value, 1, 10))
      {this.focus();this.select();} else {gracies()}"
   VALUE="0">
Aquest és un altre exemple en JavaScript. Si el camp "num" ha canviat des de que ha rebut el focus es comprova que el valor que té és 1 o 10; si és així s'executa la funció "gracies()"; en cas contrari es retorna el focus a l'element de control.

Ex.3:
<INPUT name="edit1" size="50">    
<SCRIPT type="text/vbscript">
   Sub edit1_canviat()
      If edit1.value = "abc" Then
         boto1.enabled = True
      Else
         boto1.enabled = False
      End If
   End Sub
</SCRIPT>
Aquest és un exemple en VBScript d'una rse (rutina de servei a un event) per a un camp de text.

Ex.4:
<INPUT name="edit1" size="50">
<SCRIPT type="text/tcl">
   proc edit1_canviat {} {
      if {[edit value] == abc} {
         boto1 enable 1
      } else {
         boto1 enable 0
      }
   }
   edit1 onChange edit1_canviat
</SCRIPT>
Aquest és el mateix exemple que l'anteror però utilitzant Tcl.

Ex.5:
<BUTTON type="button" name="elmeuboto" value="10">
<SCRIPT type="text/javascript">
   function elmeu_onclick() {
      . . .
   }
   document.form.elmeuboto.onclick = elmeu_onclick
</SCRIPT>
</BUTTON>
Aquest és un exemple en JavaScript per a un vincle amb un event dins d'un script. Això és una simple rutina de servei a un "clic".

Ex.6:
<SCRIPT type="text/javascript">
   function elmeu_onload() {
      . . .
   }

   var fin = window.open("alguna/altra/URI")
   if (fin) fin.onload = elmeu_onload
</SCRIPT>
Aquesta és una rutina més interessant de servei a una finestra.

Ex.7:
<SCRIPT type="text/tcl">
   proc elmeu_onload {} {
      . . .
   }
   set fin [window open "alguna/altra/URI"]
   if {$fin != ""} {
      $fin onload elmeu_onload
   }
</SCRIPT>
La mateixa rse en Tcl.


Cal observar que "document.write" o declaracions equivalents en rutines de servei a events intrínsecs creen i escriuen en un nou document enlloc de modificar l'actual.
Modificació dinàmica dels documents
Els scripts que s'executen quan un document és carregat poden ser capaços de modificar els continguts del document dinàmicament. L'habilitat per a fer això depèn del llenguatge d'script en sí mateix (per ex., la instrucció "document.write" en el model d'objecte de l'HTML suportat per alguns venedors).

La modificació dinàmica d'un document pot modelar-se així:

  1. Tots els elements SCRIPT s'avaluen en ordre a mesura que el document es va carregant.
  2. Totes les construccions d'scripts de dins d'un element SCRIPT donat que generin CDATA de l'SGML s'avaluen. El seu text generat combinat és inserit en el document en el lloc de l'element SCRIPT.
  3. La CDATA generada és reavaluada.

Els documents HTML estan restringits a conformar amb la DTD de l'HTML tant abans com després de processar els elements SCRIPT.

Ex.1:
   <TITLE>Document test</TITLE>
   <SCRIPT type="text/javascript">
      document.write("<p><b>Hola a tothom!</b>")
   </SCRIPT>
Aquest exemple, que il·lustra com els scripts poden modificar un document dinàmicament, té el mateix efecte que:
	<TITLE>Document test</TITLE>
	<P><B>Hola a tothom!</B>
DISSENY DE DOCUMENTS PER A AGENTS D'USUARI QUE NO SUPORTEN SCRIPTS
L'element NOSCRIPT
L'element NOSCRIPT permet als autors proporcionar un contingut alternatiu quan un script no és executat. El contingut d'un element NOSCRIPT ha de ser mostrat pels agents d'usuari que no poden processar scripts, i els agents d'usuari que són capaços de processar scripts només poden mostrar el contingut d'un element NOSCRIPT en els següents casos:


Ex.:
<SCRIPT type="text/tcl">
   ...codi script Tcl per a inserir dades...
</SCRIPT>
<NOSCRIPT>
   <P>Accediu a les <A href="http://algunlloc.com/dades">dades.</A>
</NOSCRIPT>
En aquest exemple un agent d'usuari que executi l'element SCRIPT inclourà algunes dades creades dinàmicament en el document. Si l'agent d'usuari no suporta scripts, l'usuari podrà encara recuperar les dades a través d'un link.
Ocultar les dades d'script als agents d'usuari
Els agents d'usuari que no reconeguin l'element SCRIPT provablement presentaran els continguts d'aquest element en forma de text. Algunes màquines que reconeixen els scripts, incloent-hi les dels llenguatges JavaScript, VBScript i Tcl, permeten que les instruccions de l'script estiguin incloses dins un comentari SGML. Els agents d'usuari que no reconeixen l'element SCRIPT ignoraran d'aquesta manera el comentari mentre que les màquines més intel·ligents entendran que l'script que es troba entre comentaris hauria de ser executat.

Una altra solució al probema és guardar els scripts en documents externs i fer-hi referència amb l'atribut src.

Comentar scripts en JavaScript.

La màquina JavaScript permet que la cadena "<!--" es trobi al principi d'un element SCRIPT i ignora els caràcters que es troba fins al final de la línia. JavaScript interpreta "//" com l'inici d'un comentari que s'extén fins al final de la línia actual. Això es necessita per ocultar la cadena "-->" a l'analitzador gramatical de JavaScript.

Ex.:
<SCRIPT type="text/javascript">
<!--  ocultació dels de l'script als navegadors antics
   function quadrat(i) {
     document.write("La crida ha passat ", i ," a la funció.","<BR>")
     return i * i
   }
document.write("La funció ha retornat ",quadrat(5),".")
// final de la ocultació de l'script als navegadors antics  -->
</SCRIPT>
Comentar scripts en VBScript.

En VBScript, un caràcter de cometes simples farà que la resta de la línia actual es tracti com a un comentari. Per tant, es pot utilitzar per amagar la cadena "-->" al VBScript.

Ex.:
<SCRIPT type="text/vbscript">
   <!--
      Sub funcio()
         ...
      End Sub
   ' -->
</SCRIPT>
Comentar scripts en TCL.

En Tcl, el caràcter "#" comenta fins al final de la línia.

Ex.:
<SCRIPT type="text/tcl">
<!--  ocultació de l'script als navegadors antics
   proc quadrat {i} {
      document write "La crida ha passat $i a la funció.<BR>"
      return [expr $i * $i]
   }
   document write "La funció ha retornat [quadrat 5]."
# final de la ocultació als navegadors antics  -->
</SCRIPT>
Nota. Alguns navegadors tanquen els comentaris en el primer caràcter ">" que es troben, per tant, per ocultar el contingut d'script a aquests navegadors, es poden transposar els operands i invertir els operadors (per ex., utilitzar "y < x" enlloc de "x > y") o bé utilitzar els "escapes" per a ">" depenents del llenguatge d'script.
Tancar
Pàgina Principal
Introducció al Manual d'HTML Dinàmic
Glossari
Referències























HTML 4.0
Introducció al manual d'HTML 4.0
Taules
Formularis
Objectes, imatges i applets
Scripts
Informació de l'idioma i sentit del text
Frames
Nous elements
Elements menyspreuats i obsolets
Fulls d'estil
Nous atributs de l'HTML 4.0
Índex d'atributs nous
Índex d'atributs menyspreuats
DTD
Annexe












Introducció als CSS
Introducció als CSS2 i al manual
Propietats CSS2
Fulls d'estil audibles
Model de caixa
Sintaxi i tipus bàsics de dades
Model de formatat visual
Detalls del model de formatat visual
Assignar valors de propietats, la cascada i l'herència
Interfície d'usuari
Efectes visuals
Text
Taules
Fonts
Contingut generat, numeració automàtica i llistes
Colors i fons
Selectors
Tipus de mitjans
Mitjans paginats
Suport de CSS2
Annexe




Introducció al DOM
DOM Nivell 1 - Nucli
DOM Nivell 1 - HTML
Articles sobre el DOM






















Programació en DHTML
Demos