In HTML 4.0 Strict und XHTML 1.0 STRICT ist das Zielattribut im <a>-Tag nicht zulässig, was für Webdesigner frustrierend ist. Die Verwendung in Übergangsspezifikationen ist weiterhin zulässig. Aber durch bestimmte Methoden können wir dieses Problem lösen.
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. Seine Attributwerte (z. B. Nächster, Vorheriger, Kapitel, Abschnitt) werden in der Spezifikation definiert. Die meisten dieser Attribute werden verwendet, um Beziehungen zwischen kleinen Teilen eines großen Dokuments zu definieren. Tatsächlich ermöglicht die Spezifikation Entwicklern die freie Verwendung nicht standardmäßiger Eigenschaftswerte für bestimmte Anwendungen.
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 möchte beim Laden der Webseite alle Hyperlinks im Dokument finden, die wir als rel="external" definieren.
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 an der Stelle, an der Sie ein neues Fenster öffnen möchten
if (anchor.getAttribute("href") &&
Anchor.getAttribute("rel") == "external")
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") == "external")
Anchor.target = "_blank";
}
}
window.onload = externalLinks;