JavaScript

pagine di Roberto Ricci L.S. "A. Righi", Bologna.

Documento HTML: testo, ipertesto e multimedia

Struttura di una pagina web

Una pagina web è il risultato dell'elaborazione, da parte di un browser, di un documento HTML, un testo racchiuso tra i marcatori <html> e </html>. L'acronimo HTML (HyperText Markup Language) designa un linguaggio di marcatori che indicano al browser i formati o le funzioni delle diverse parti del documento come:

intestazione, racchiusa tra <head> e </head>, che comprende ad esempio:
- titolo, racchiuso tra <title> e </title>, che compare nella barra in alto
- stili, descrizioni racchiuse tra <style> e </style>
- script, in JavaScript o altri linguaggi di scripting, con istruzioni racchiuse tra <script> e </script>
e poi, in alternativa tra loro,
- corpo, racchiuso tra <body> e </body> costituito da
  - testo in diversi formati e diversi caratteri
  - elementi
    - ipertestuali come i link
    - multimediali come immagini, suoni
    - interattivi come caselle di testo, di selezione
    - applicazioni come applet java, ...
- incorporamento di altri documenti HTML tra <frameset> e </frameset>

Formati del testo

L'insieme completo dei marcatori che indicano al browser come visualizzare una certa parte del testo è numeroso. Per i nostri obiettivi è sufficiente sottolineare:

titoli, racchiusi tra <hn> e </hn>
paragrafi, racchiusi tra <p> e </p>
elenchi
- numerati, racchiusi tra <ol> e </ol>
- non numerati, racchiusi tra <ul> e </ul>

Elementi per l'ipertestualità e per la multimedialità

Un particolare formato del testo è il collegamento (link). Quando una parte di testo è inclusa tra <a href="..."> e </a>, essa viene evidenziata anche con il cambiamento dell'icona associata al cursore che suggerisce di fare click. Dopo il click viene effettuato il collegamento, a un altro punto del testo (ancora) o alla pagina web il cui indirizzo è al posto nei puntini in href="...".

E' possibile inserire anche immagini mediante il marcatore <img src="..." /> e attribuire anche a questi elementi - o a loro parti - della pagina la funzione di link, come nell'immagine che segue e che consente di approfondire.

Si può inserire anche

un brano midi con <embed src="..."/>

un filmato ancora con <embed src="..."/> o meglio con <object> ... </object>

o un'applicazione scritta in java con <applet> ... </applet>

Bubble Sort	Bi-Directional Bubble Sort	Quick Sort

Esempi:

analizza parti di un documento HTML facendo click su queste
produce liste variabili ordinate di elementi
inserisce link ad istruzioni JavaScript
alterna due immagini
inserisce applet che confrontano metodi di ordinamento

Esercizi:

leggere un elenco di dati e sintetizzarli come valori e frequenze sistemandoli in tabella (soluz.)
visualizzare una matrice in forma di tabella (soluz.)
produrre la tabella (x,y) per una funzione (soluz.)

pagine di Roberto Ricci L.S. "A. Righi", Bologna. Ultima revisione