Alternatives pour remplacer l'attribut target blank
Initialement en HTML, lorsqu'on voulait ouvrir un lien dans une nouvelle fenêtre, on devait s'y prendre comme ceci :
<a href="http://www.google.com" target="_blank">Lien vers Google</a>
Malgré que l'attribut target soit déprécié depuis le XHTML 1.0, il est encore énormément utilisé. Depuis, une alternative populaire est de le remplacer par un appel JavaScript placé sur l'événement OnClick du lien :
<a href="http://www.google.com" onclick="window.open(this.href); return false;">Lien vers Google</a>
Pourtant, il serait possible de venir attacher ces événements par programmation en utilisant une combinaison de JavaScript, de Prototype, de sélecteur CSS et de l'attribut "rel". Normalement, l'attribut rel permet de décrire la relation entre la source du document et sa ressource spécifiée dans l'ancre (attribut href). Comme il s'agira d'une relation externe, j'utiliserai la valeur "external" qui est valide pour la norme XHTML :
<a href="http://www.google.com" rel="external">Lien vers Google</a>
À l'aide de la librairie prototype.js, on attachera une fonction d'initialisation (initExternalLinks) au chargement du document. À l'aide d'un sélecteur CSS appelé par $$ (depuis prototype 1.5.1), on cherchera dans le document tous les liens qui comportent l'attribut rel="external". À chaque lien trouvé, on attachera une fonction JavaScript qui permettra de prendre le href du lien et qui l'ouvrira dans une nouvelle page :
<script language="javascript" type="text/javascript">Ce code, placé en entête de chaque page (idéalement dans une librairie .js qu'on attachera aux documents, de même que prototype.js) permettra de créer des liens externes XHTML valides qui s'ouvriront dans une nouvelle fenêtre ou un nouvel onglet du fureteur.
function initExternalLinks(selector){
$$(selector).invoke('observe', 'click', function(e){
if(this.href){
window.open(this.href);
Event.stop(e);
}
});
}
Event.observe(window, 'load', function(){
initExternalLinks('a[rel=external]');
}
);
</script>