Dokument: createElementNS()-Methode

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

Erstellt ein Element mit dem angegebenen Namespace-URI und qualifiziertem Namen.

Um ein Element ohne Angabe eines Namespace-URI zu erstellen, verwenden Sie die createElement()-Methode.

Syntax

js
createElementNS(namespaceURI, qualifiedName)
createElementNS(namespaceURI, qualifiedName, options)

Parameter

namespaceURI

Ein String, der den Namespace-URI angibt, der dem Element zugeordnet wird. Die namespaceURI-Eigenschaft des erstellten Elements wird mit dem Wert von namespaceURI initialisiert. Siehe Gültige Namespace-URIs.

qualifiedName

Ein String, der den Typ des zu erstellenden Elements angibt. Die nodeName-Eigenschaft des erstellten Elements wird mit dem Wert von qualifiedName initialisiert.

options Optional

Ein optionales ElementCreationOptions-Objekt, das eine einzelne Eigenschaft namens is enthält, deren Wert der Tag-Name eines zuvor mit customElements.define() definierten benutzerdefinierten Elements ist. Zur Rückwärtskompatibilität mit früheren Versionen der Custom Elements Specification erlauben einige Browser hier, einen String anstelle eines Objekts zu übergeben, wobei der Wert des Strings der Tag-Name des benutzerdefinierten Elements ist. Siehe Erweiterung nativer HTML-Elemente für weitere Informationen zur Verwendung dieses Parameters.

Das neue Element erhält ein is-Attribut, dessen Wert der Tag-Name des benutzerdefinierten Elements ist. Benutzerdefinierte Elemente sind ein experimentelles Feature, das nur in einigen Browsern verfügbar ist.

Rückgabewert

Das neue Element.

Ausnahmen

NamespaceError DOMException

Wird ausgelöst, wenn der namespaceURI-Wert kein gültiger Namespace-URI ist.

InvalidCharacterError DOMException

Wird ausgelöst, wenn der qualifiedName-Wert kein gültiger XML-Name ist; zum Beispiel, wenn er mit einer Zahl, einem Bindestrich oder einem Punkt beginnt oder Zeichen enthält, die keine alphanumerischen Zeichen, Unterstriche, Bindestriche oder Punkte sind.

Wichtige Namespace-URIs

HTML

http://www.w3.org/1999/xhtml

SVG

http://www.w3.org/2000/svg

MathML

http://www.w3.org/1998/Math/MathML

Beispiele

Dies erstellt ein neues <div>-Element im XHTML-Namespace und fügt es dem vbox-Element hinzu. Obwohl dies kein besonders nützliches XUL-Dokument ist, zeigt es die Verwendung von Elementen aus zwei verschiedenen Namespaces innerhalb eines Dokuments:

xml
<?xml version="1.0"?>
<page xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
      xmlns:html="http://www.w3.org/1999/xhtml"
      title="||Working with elements||"
      onload="init()">

<script type="application/javascript"><![CDATA[
 let container;
 let newDiv;
 let textNode;

 function init(){
   container = document.getElementById("ContainerBox");
   newDiv = document.createElementNS("http://www.w3.org/1999/xhtml", "div");
   textNode = document.createTextNode("This is text that was constructed dynamically with createElementNS and createTextNode then inserted into the document using appendChild.");
   newDiv.appendChild(textNode);
   container.appendChild(newDiv);
 }

]]></script>

 <vbox id="ContainerBox" flex="1">
  <html:div>
   The script on this page will add dynamic content below:
  </html:div>
 </vbox>

</page>

Hinweis: Das oben angegebene Beispiel verwendet ein Inline-Skript, das in XHTML-Dokumenten nicht empfohlen wird. Dieses spezielle Beispiel ist tatsächlich ein XUL-Dokument mit eingebettetem XHTML, jedoch gilt die Empfehlung dennoch.

Spezifikationen

Specification
DOM Standard
# ref-for-dom-document-createelementns①

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch