JavaScript/Oggetto document: differenze tra le versioni

Contenuto cancellato Contenuto aggiunto
Ramac (discussione | contributi)
metodi
Ramac (discussione | contributi)
+ proprietà + links
Riga 1:
{{JavaScript}}
Oltre alle proprietà elencate nel [[JavaScript/BOM|modulo precedente]], l'oggetto globale <code>window</code> espone altre importanti proprietà, tra le quali '''l'oggetto <code>window.document<code>'''.
<br/>Questo oggetto permette di ottenere un riferimento al documento [[w:HTML|HTML]] e agli elementi in essa contenuti.
 
== Metodi ==
L'oggetto espone solo pochi metodi:
* '''open()''' e '''close()''' rispettivamente aprono e chiudono un flusso di informazioni per l'uso dei metodi elencati sotto
Line 29 ⟶ 30:
</source>
 
== Proprietà ==
Le proprietà dell'oggetto document possono essere relative:
* agli attributi dell'elemento <code>&lt;body&gt;</code> della pagina
* al contenuto vero e proprio del corpo del documento
* altre proprietà del documento HTML
 
Nel primo gruppo, troviamo proprietà come:
* <code>fgColor</code> e <code>bgColor</code>: indicano rispettivamente il colore di primo piano e di sfondo della pagina. Corrispondono agli attributi <code>text</code> e <code>background</code>.
* <code>linkColor</code>, <code>alinkColor</code>, <code>valinkColor</code>: il colore rispettivamente dei [[w:Link|link]] allo stato normale, dei collegamenti attivi e dei collegamenti visitati. Corrisponde agli attributi HTML <code>link</code>, <code>alink</code> e <code>vlink</code>.
 
Tra le proprietà del documento HTML la più rilevante è <code>document.title</code>, che permette di accedere al titolo del documento (etichetta <code>&lt;title&t;</code>.
 
=== Accedere ai link nella pagina ===
Il primo attributo che ci permette realmente di accedere agli elementi della pagina è l'array <code>links</code> che restituisce un riferimento agli oggetti &lt;a&gt; presenti nel documento:
<source lang=javascript>var l = document.links[0]; //restituisce un riferimento al primo link nella pagina
alert('Nella pagina ci sono ' + document.links.length + ' link'); //ricordiamoci che è un array</source>
Ciascun oggetto link presenta le seguenti proprietà:
* <code>href</code>: restituisce o imposta il valore dell'attributo <code>href</code> del link. A partire da esso derivano alcuni attributi relativi all'URL a cui punta il link:
** <code>hostname</code>: indica il nome dell'[[w:Host|host]] dell'[[w:URL|URL]]
** <code>pathname</code>: indica il percorso oggetto indicato dell'URL
** <code>port</code>: indica la porta dell'URL
** <code>protocol</code>: indica il protocollo della risorsa a cui punta l'URL (per esempio [[w:FTP|FTP]] o [[w:HTTP|HTTP]])
** <code>search</code>: restituisce l'eventuale ''querystring'' (ad esempio <code>pagina.htm?'''name=Mario&cognome=Rossi'''</code>)
* <code>target</code>: il valore dell'attributo <code>target</code> del link
Ad esempio possiamo decidere di impostare il target di tutti i link nella pagina a <code>_blank</code>:
<source lang=javascript>
for (i in document.links) {
document.links[i].target = "_blank"; //imposta l'attributo target
}
</source>
[[Categoria:JavaScript|Oggetto document]]