In HTML 4.0 Strict und XHTML 1.0 STRICT darf das Zielattribut nicht im <a>-Tag verwendet werden, was für Webdesigner eine frustrierende Sache ist. In den Übergangsspezifikationen ist dies jedoch weiterhin zulässig Problem kann gelöst werden.
Das Zielattribut wurde aus der HTMl4.0-Spezifikation entfernt, es wurde jedoch ein weiteres Attribut hinzugefügt: rel. Dieses Attribut wird verwendet, um die Beziehung zwischen dem Dokument, das den Link enthält, und dem verknüpften Dokument anzugeben :nächstes, vorheriges, Kapitel, Abschnitt) Die meisten dieser Attribute werden verwendet, um die Beziehung zwischen kleinen Teilen in einem großen Dokument zu definieren. Tatsächlich ermöglicht die Spezifikation Entwicklern die freie Verwendung nicht standardmäßiger Attributwerte, um spezifische Aufgaben zu erledigen Anwendung.
Hier verwenden wir einen benutzerdefinierten externen Wert für das rel-Attribut, um einen Link zum Öffnen eines neuen Fensters zu markieren.
Linkcode, der nicht den neuesten Webstandards entspricht:
<a href=document.html target=_blank>externer Link</a>
Verwenden Sie das rel-Attribut:
<a href=document.html rel=external>externer Link</a>
Nachdem wir nun einen Link zu einem neuen Fenster erstellt haben, das den Webstandards entspricht, müssen wir auch JavaScript verwenden, um ein neues Fenster zu implementieren. Das Skript muss alle Fenster im Dokument finden, die wir als rel=external definiert haben wenn die Webseite geladen wird.
Zuerst müssen wir den Browser bestimmen.
if (!document.getElementsByTagName) return;
getElementsByTagName ist eine einfach zu verwendende Methode im DOM1-Standard und wird mittlerweile von den meisten Browsern unterstützt. Da einige alte Browser wie Netscape 4 und IE4 DOM1 nicht unterstützen, müssen wir dies ausschließen, indem wir feststellen, ob diese Methode vorhanden ist. diese älteren Versionen von Browsern.
Als nächstes erhalten wir alle <a>-Tags im Dokument über die Methode getElementsByTagName:
var Anchors = document.getElementsByTagName(a);
Anker werden als Array zugewiesen, das jedes <a>-Tag enthält. Jetzt müssen wir jedes <a>-Tag durchlaufen und es ändern:
for (var i=0; i < Anchors.Length; i++) {
var Anker = Anker;
Suchen Sie das <a>-Tag, um ein neues Fenster zu implementieren
if (anchor.getAttribute(href) &&
Anchor.getAttribute(rel) == extern)
Als nächstes erstellen Sie den Attributwert target und weisen den Wert _target zu:
Anchor.target = _blank;
Vollständiger Code:
--------------------------
Funktion externalLinks() {
if (!document.getElementsByTagName) return;
var Anchors = document.getElementsByTagName(a);
for (var i=0; i<anchors.length; i++) {
var Anker = Anker;
if (anchor.getAttribute(href) &&
Anchor.getAttribute(rel) == extern)
Anchor.target = _blank;
}
}
window.onload = externalLinks;