SELFHTML: JavaScript / Référence objet / links

links: généralités pour l'utilisation

Avec l'objet links, qui se trouve dans la hiérarchie objet JavaScript sous l'objet document, vous avez accès aux liens définis dans un fichier HTML. .

En JavaScript 1.0 il est somme toute possible de lire le nombre de liens dans un fichier. Depuis JavaScript 1.2 d'autres propriétés sont pourtant disponibles.

Accès aux cibles de liens

Vous pouvez avec JavaScript rechercher des cibles de liens en HTML.

Exemple:

Exemple d'affichage: aperçu

<html><head><title>Test</title>
</head><body>
<a href="http://www.yahoo.fr/">Yahoo</a><br>
<a href="http://www.google.fr/">Google</a><br>
<a href="http://www.excite.fr/">Excite</a><br>
<script type="text/javascript">
<!--
for(var i=0; i < document.links.length; ++i)
 document.write("<br>" + document.links[i]);
//-->
</script>
</body></html>

Explication:

Dans l'exemple sont notés quelques liens. Au dessous figure un script JavaScript qui, à l'aide de document.write() dans une boucle for, écrit pour chaque lien la cible correspondante dans le fichier. Il s'agit de la valeur notée pour les liens derrière l'attribut href=.

L'accès aux liens se fait avec des numéros d'index. Pour cela, mentionnez document.links suivi, entre crochets, du numéro d'ordre dans le fichier du lien que vous désirez. Pensez que le compteur commence à 0, c'est à dire qu'il vous faut adresser le premier lien avec links[0] le deuxième avec links[1] etc. Pour compter prévaut l'ordre dans lequel les liens sont notés dans le fichier. Pour compter, même les liens dans les graphiques composés de liens (repère <area>) sont à prendre en considération.

Propriétés location de liens

Outre les propriétés spécifiques aux liens, l'objet link connaît également toutes les propriétés de l'objet location.

Exemple:

Exemple d'affichage: aperçu

<html><head><title>Test</title>
</head><body>
<a target="_top" href="http://actuel.fr.selfhtml.org/">SELFHTML</a><br>
<script type="text/javascript">
<!--
document.links[0].port="8081";
//-->
</script>
</body></html>

Explication:

Par l'objet location, vous avez accès à l'URI complète du lien affiché. Vous pouvez interroger et modifier pour traitement l'URI ou certaines de ses parties. Notez pour cela l'objet link, donc par exemple document.link[0], suivi d'un point et enfin de la propriété désirée de l'objet location.
Dans l'exemple est défini un lien. Avec document.links[0].port= la propriété port est modifiée.

Attention:

Dans Netscape 6.1 et dans Opera 5.12 vous ne pouvez que lire sans cependant les modifier, les propriétés de l'objet location (à l'exception de la propriété href).

name

Sauvegarde le nom d'un lien. En utilisant l'attribut name= le lien est en même temps une partie constituante de l'objet anchors.

Exemple:

Exemple d'affichage: aperçu

<html><head><title>Test</title>
</head><body>
<a name="catalogue" href="http://www.yahoo.fr/">Yahoo</a><br>
<a name="moteur_recherche
" href="http://www.google.fr/">Google</a><br>
<a name="redaction" href="http://actuel.fr.selfhtml.org/>">SELFHTML</a><br>
<script type="text/javascript">
<!--
 for(var i=0; i < document.links.length; ++i)
 document.write("<br>" + document.links[i].name);
//-->
</script>
</body></html>

Explication:

Avec document.links[0].name vous pouvez rechercher le nom d'un lien dans un fichier HTML. L'exemple contient d'abord du texte HTML avec différents liens et écrit à la fin les noms des liens dans le document avec document.write().

Attention:

Actuellement, il n'est possible de modifier le nom d'un lien qu'avec Netscape 6.1.

length

Sauvegarde le nombre de liens définis dans un fichier HTML.

Exemple:

Exemple d'affichage: aperçu

<html><head><title>Test</title>
</head><body>
<a href="http://www.yahoo.fr/">Yahoo</a><br>
<a href="http://www.lycos.fr/">Lycos</a><br>
<map name="image_test">
<area shape="rect" coords="1,1,249,49" href="#Ziel_1" alt="">
<area shape="rect" coords="1,51,149,299" href="#Ziel_2" alt="">
</map>
<img src="hypgraf.gif" width="400" height="400" usemap="#image_test" alt="">
<script type="text/javascript">
<!--
document.write("<p>Le fichier a " + document.links.length + " liens<\/p>");
//-->
</script>
</body></html>

Explication:

Avec document.links.length , vous pouvez rechercher le nombre de liens dans un fichier HTML. L'exemple contient dans un premier temps du texte HTML avec divers liens et écrit à la fin avec document.write() combien de liens ont été trouvés dans le fichier. Veillez cependant que sont pris en considération (depuis Netscape 3.0) même les liens dans les graphiques composés de liens, définis avec le repère <area>.

target

Sauvegarde la fenêtre cible d'un lien.

Exemple:

Exemple d'affichage: aperçu

<html><head><title>Test</title>
</head><body>
<a href="http://actuel.fr.selfhtml.org/" target="_top">SELFHTML</a><br>
<script type="text/javascript">
<!--
 document.links[0].target="_blank";
//-->
</script>
</body></html>

Explication:

Avec document.links[0].target vous pouvez rechercher la fenêtre cible d'un lien. L'exemple contient un lien qui ouvre sa cible dans la fenêtre supérieure. Dans le passage JavaScript qui suit est affectée à ce lien avec document.links[0].target="_blank" une autre fenêtre cible. Cela conduit à ce que la cible du lien est ouverte dans une nouvelle fenêtre.

Attention:

L'édition Macintosh de l'Explorer Internet MS n'interprète pas cet exemple.

text

Sauvegarde le texte d'un lien.

Exemple:

Exemple d'affichage: aperçu

<html><head><title>Test</title>
</head><body>
<a href="http://www.yahoo.fr/">Yahoo</a><br>
<a href="http://www.google.fr/">Google</a><br>
<a href="http://actuel.fr.selfhtml.org/">SELFHTML</a><br>
<script type="text/javascript">
<!--
for(var i=0; i < document.links.length; ++i)
 document.write("<br>" + document.links[i].text);
//-->
</script>
</body></html>

Explication:

Avec document.anchors[0].text vous pouvez rechercher le texte d'un lien placé entre <a> et </a>. L'exemple contient d'abord quelques liens. Au dessous se trouve un JavaScript qui écrit pour chacun des liens le texte du lien dans le fichier avec document.write() dans une boucle for.

x

Sauvegarde la position horizontale d'un lien mesurée à partir du bord de la fenêtre.

Exemple:

Exemple d'affichage: aperçu

<html><head><title>Test</title>
</head><body>
Voici un texte et ensuite un <a href="javascript:alert(document.links[0].x)">lien</a><br>
</body></html>

Explication:

Avec document.links[0].x vous pouvez rechercher la position horizontale d'un lien dans un fichier HTML. L'exemple contient un petit texte dans lequel un lien est défini. En cliquant sur ce lien, la position de ce lien à partir du bord gauche de la fenêtre est sortie avec alert().

y

Sauvegarde la position verticale d'un lien mesurée à partir du bord de la fenêtre.

Exemple:

Exemple d'affichage: aperçu

<html><head><title>Test</title>
</head><body>
Voici un texte et ensuite un <a href="javascript:alert(document.links[0].x)">lien</a><br>
</body></html>

Explication:

Avec document.links[0].y vous pouvez rechercher la position horizontale d'un lien dans un fichier HTML. L'exemple contient un petit texte dans lequel un lien est défini. En cliquant sur ce lien, la position de ce lien à partir du bord supérieur de la fenêtre est sortie avec alert().