La proprietà links in Javascript

Quando il browser carica la pagina web, crea un oggetto per ogni link presente nella pagina con il tag <a> e l'attributo href.

Queste informazioni vengono registrate all'interno del DOM nella proprietà links dell'oggetto document.

document.links

Questo insieme è chiamato "collezione di link"

Nota. Le informazioni sono scritte come in un array like. Quindi, il primo link della pagina web viene registrato nella posizione zero. Il secondo link della pagina nella posizione uno. E via dicendo. In pratica, l'oggetto links funziona in maniera simile all'oggetto document.images ossia alla "collezione di immagine" dove sono raccolte tutte le immagini presenti nella pagina.

Ecco un esempio pratico.

Questo documento HTML ha due link, ossia due tag <a> con altrettanti attributi href

<!DOCTYPE html>

<html>
<body>

<h2>My Heading</h2>

<p>Play around with the code and click on the "Run" button to view the result.</p>

<p id="demo"></p>

<a id="link1" href="https://es.nigiara.com">Example</a>
<a id="link2" href="https://fr.nigiara.com">Google</a>

<script>
var lista = document.links;
document.write(lista.length);
document.write(lista[0]);
document.write(lista[1]);
</script>

</body>
</html>

Il codice Javascript legge il contenuto nel DOM tramite la proprietà document.links e lo salva nella variabile lista.

Per sapere quanti link sono presenti nella pagina, utilizzo l'attributo length

document.write(lista.length);

In questo caso, il risultato è 2, perchè ci sono due link nella pagina.

2

Per leggere l'indirizzo URL del primo link nella pagina, utilizzo posizione zero dell'array ossia lista[0]

document.write(lista[0]);

In questo caso Javascript mi restituisce

https://es.nigiara.com/

Per leggere il secondo link nella pagina, invece, utilizzo la posizione uno ossia lista[1]

document.write(lista[1]);

Javascript restituisce il secondo link nel documento HTML

https://fr.nigiara.com/

Oltre a vedere a cosa puntano i link, posso anche cambiarli.

E così via.

 


 

Segnalami un errore, un refuso o un suggerimento per migliorare gli appunti

FacebookTwitterLinkedinLinkedin
knowledge base

Document in Javascript

I metodi

Le proprietà