HTMLBaseElement.target — Eigenschaft · JavaScript-Referenz

Signatur

HTMLBaseElement.target

Beschreibung

Die Eigenschaft target des HTMLBaseElement-Interfaces spiegelt das gleichnamige HTML-Attribut des <base>-Elements. Sie legt fest, in welchem Browsing-Kontext (Tab, Fenster, iframe) Hyperlinks (<a>, <area>) und Formulare (<form>) ihr Ergebnis anzeigen, sofern diese Elemente kein eigenes target-Attribut besitzen.

Gültige Werte sind die Schlüsselwörter _self (aktueller Kontext, Standard), _blank (neuer Tab/neues Fenster), _parent (übergeordneter Kontext) und _top (oberster Kontext) sowie ein beliebiger Name eines Fensters oder iframes (name-Attribut). Ist das Attribut nicht gesetzt, liefert die Eigenschaft einen leeren String.

Typische Einsatzfälle sind eingebettete Dokumente (z. B. Hilfe- oder Vorschauseiten in einem iframe), bei denen alle Links automatisch im übergeordneten Fenster oder in einem neuen Tab geöffnet werden sollen, ohne jedes einzelne <a> anzupassen. Da nur das erste <base>-Element mit target-Attribut im Dokument berücksichtigt wird, sollte man per document.querySelector('base') gezielt dieses Element ansprechen.

Parameter

Name	Typ	Default	Beschreibung
$value	string	""	Beim Setzen: neues Standard-Ziel, z. B. `"_blank"`, `"_top"` oder der Name eines Frames. Wird unverändert als Attribut geschrieben.

Rückgabewert

Typ

string

Beschreibung

Der aktuelle Wert des target-Attributs oder ein leerer String, wenn keins gesetzt ist.

Beispiele

Standard-Ziel auslesen

// HTML: <base href="https://example.com/" target="_blank">
const base = document.querySelector('base');
console.log(base?.target ?? 'kein <base>-Element vorhanden');

_blank

Alle Links eines iframe-Dokuments im Hauptfenster öffnen

// Im Dokument, das im iframe geladen wird
const ensureBase = () => {
  let base = document.querySelector('base');
  if (!base) {
    base = document.createElement('base');
    document.head.prepend(base);
  }
  return base;
};

const base = ensureBase();
base.target = '_top';
console.log(document.head.innerHTML.includes('target="_top"'));

true

Formularergebnisse in einem benannten iframe anzeigen

// HTML: <iframe name="vorschau"></iframe>
//       <form action="/render"> ... </form>
const base = document.querySelector('base') ?? document.head.appendChild(document.createElement('base'));
base.target = 'vorschau';

// Eigenes target am Element hat Vorrang vor <base target>
const link = document.createElement('a');
link.href = '/hilfe';
link.target = '_self';
console.log(base.target, link.target);

vorschau _self

// Wichtig · Fallstricke

Vorrang: Ein am Link oder Formular gesetztes target-Attribut (bzw. formtarget am Button) überschreibt immer den Wert aus <base>.
Nur das erste Element zählt: Existieren mehrere <base>-Elemente, wird nur das erste mit target-Attribut ausgewertet; weitere werden ignoriert.
Keine Validierung: Die Eigenschaft akzeptiert beliebige Strings. Tippfehler wie \"blank\" (ohne Unterstrich) erzeugen stillschweigend ein neues benanntes Fenster.
Sicherheit: Links, die über _blank geöffnet werden, erhalten in modernen Browsern implizit rel=\"noopener\". In älteren Browsern konnte die geöffnete Seite über window.opener auf das Ursprungsfenster zugreifen (Tabnabbing) – bei Bedarf rel=\"noopener noreferrer\" explizit setzen.
Kompatibilität: Wird von allen gängigen Browsern seit Langem unterstützt. Popup-Blocker können _blank-Navigationen blockieren, die nicht durch eine Nutzeraktion ausgelöst wurden.

Siehe auch

CSSPseudoElement.parent HTMLBaseElement.href HTMLAreaElement.target HTMLFormElement.target HTMLAnchorElement.target