Es gibt viele Möglichkeiten, wie Sie den Titel ändern können. Die beiden wichtigsten sind wie folgt:
Die fragwürdige Methode
Fügen Sie ein Titel-Tag in den HTML-Code ein (z. B. <title>Hello</title>) und dann in Javascript:
let title_el = document.querySelector("title");
if(title_el)
title_el.innerHTML = "World";
Die offensichtlich richtige Methode
Am einfachsten ist es, die vom Document Object Model (DOM) bereitgestellte Methode tatsächlich zu verwenden.
document.title = "Hello World";
Die erstere Methode ist im Allgemeinen das, was Sie tun würden, um Tags im Hauptteil des Dokuments zu ändern . Die Verwendung dieser Methode zum Ändern von Metadaten-Tags, wie sie im Kopf (wie title) zu finden sind, ist bestenfalls fragwürdig, nicht idiomatisch, zunächst nicht sehr gut und möglicherweise nicht einmal portabel. Eine Sache, auf die Sie sich jedoch verlassen können, ist, dass es andere Entwickler nervt, wenn sie title.innerHTML = ...in Code sehen, den sie pflegen.
Was Sie wollen , ist die letztere Methode. Diese Eigenschaft wird in der DOM-Spezifikation speziell zum Zweck der Änderung des Titels bereitgestellt , wie der Name schon sagt.
Beachten Sie auch, dass Sie, wenn Sie mit XUL arbeiten, möglicherweise überprüfen möchten, ob das Dokument geladen wurde, bevor Sie versuchen, den Titel festzulegen oder abzurufen, da Sie sonst undefined behavior(hier Drachen) aufrufen , was für sich genommen ein beängstigendes Konzept ist. Dies kann über JavaScript geschehen oder nicht, da die Dokumente im DOM nicht unbedingt JavaScript betreffen. Aber XUL ist ein ganz anderes Tier, also schweife ich ab.
Apropos .innerHTML
Einige gute Ratschläge, die Sie beachten sollten, wären, dass die Verwendung .innerHTMLim Allgemeinen schlampig ist. Verwenden Sie appendChildstattdessen.
Obwohl zwei Fälle, in denen ich es immer .innerHTMLnoch nützlich finde , das Einfügen von einfachem Text in ein kleines Element umfassen ...
label.innerHTML = "Hello World";
// as opposed to...
label.appendChild(document.createTextNode("Hello World"));
// example:
el.appendChild(function(){
let el = document.createElement("span");
el.className = "label";
el.innerHTML = label_text;
return el;
}());
... und einen Container räumen ...
container.innerHTML = "";
// as opposed to... umm... okay, I guess I'm rolling my own
[...container.childNodes].forEach(function(child){
container.removeChild(child);
});