Creates an element with the specified namespace URI and qualified name.
To create an element without specifying a namespace URI, use the createElement()
method.
Creates an element with the specified namespace URI and qualified name.
To create an element without specifying a namespace URI, use the createElement()
method.
js
createElementNS(namespaceURI, qualifiedName) createElementNS(namespaceURI, qualifiedName, options)
namespaceURI
A string that specifies the namespace URI to associate with the element. The namespaceURI
property of the created element is initialized with the value of namespaceURI. See Valid Namespace URIs.
qualifiedName
A string that specifies the type of element to be created. The nodeName
property of the created element is initialized with the value of qualifiedName.
options
Optional
An optional ElementCreationOptions
object containing a single property named is
, whose value is the tag name for a custom element previously defined using customElements.define()
. For backwards compatibility with previous versions of the Custom Elements specification, some browsers will allow you to pass a string here instead of an object, where the string's value is the custom element's tag name. See Extending native HTML elements for more information on how to use this parameter.
The new element will be given an is
attribute whose value is the custom element's tag name. Custom elements are an experimental feature only available in some browsers.
The new Element
.
NamespaceError
DOMException
Thrown if the namespaceURI
value is not a valid namespace URI.
InvalidCharacterError
DOMException
Thrown if the qualifiedName
value is not a valid XML name; for example, it starts with a number, hyphen, or period, or contains characters other than alphanumeric characters, underscores, hyphens, or periods.
This creates a new <div>
element in the XHTML namespace and appends it to the vbox element. Although this is not an extremely useful XUL document, it does demonstrate the use of elements from two different namespaces within a single document:
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 txtnode; function init(){ container = document.getElementById("ContainerBox"); newdiv = document.createElementNS("http://www.w3.org/1999/xhtml", "div"); txtnode = document.createTextNode("This is text that was constructed dynamically with createElementNS and createTextNode then inserted into the document using appendChild."); newdiv.appendChild(txtnode); 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>
Note: The example given above uses inline script which is not recommended in XHTML documents. This particular example is actually an XUL document with embedded XHTML, however, the recommendation still applies.
Specification |
---|
DOM Standard # ref-for-dom-document-createelementns① |
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
createElementNS |
1 | 12 | 1Doesn't conform to the DOM spec for XUL and XHTML documents:localName and namespaceURI are not set to null on the created element. |
9 | ≤12.1 | 1 | 4.4 | 18 | 4 | ≤12.1 | 1 | 1.0 |
options_parameter |
56For backwards compatibility, theoptions parameter can be an object or a string with the custom element tag name, although the string version is deprecated. |
79For backwards compatibility, theoptions parameter can be an object or a string with the custom element tag name, although the string version is deprecated. |
50Firefox accepts a string instead of an object here, but only from version 51 onwards. In version 50, options must be an object. |
No | 43For backwards compatibility, theoptions parameter can be an object or a string with the custom element tag name, although the string version is deprecated. |
No | 56For backwards compatibility, theoptions parameter can be an object or a string with the custom element tag name, although the string version is deprecated. |
56For backwards compatibility, theoptions parameter can be an object or a string with the custom element tag name, although the string version is deprecated. |
50Firefox accepts a string instead of an object here, but only from version 51 onwards. In version 50, options must be an object. |
43For backwards compatibility, theoptions parameter can be an object or a string with the custom element tag name, although the string version is deprecated. |
No | 6.0For backwards compatibility, theoptions parameter can be an object or a string with the custom element tag name, although the string version is deprecated. |
© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/Document/createElementNS