Document: createElementNS() 方法

使用指定的命名空间 URI 和限定名创建一个元素。

若要创建不指定命名空间 URI 的元素，请使用 createElement() 方法。

语法

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

参数

namespaceURI

一个指定要与元素关联的 命名空间 URI 的字符串。所创建元素的 namespaceURI 属性将使用 namespaceURI 的值进行初始化。请参阅 有效的命名空间 URI。

qualifiedName

一个指定要创建的元素类型的字符串。所创建元素的 nodeName 属性将使用 qualifiedName 的值进行初始化。

options 可选

一个可选的 ElementCreationOptions 对象，其中包含一个名为 is 的属性，其值为使用 customElements.define() 预先定义的自定义元素的标签名。为了与之前版本的 自定义元素规范 向后兼容，某些浏览器将允许您在此处传递一个字符串而不是对象，其中字符串的值为自定义元素的标签名。有关如何使用此参数的更多信息，请参阅 扩展原生 HTML 元素。

新元素将被赋予一个值为自定义元素标签名的 is 属性。自定义元素是一个实验性功能，仅在某些浏览器中可用。

返回值

新的 Element。

异常

NamespaceError DOMException

如果 namespaceURI 值不是有效的 命名空间 URI，则会抛出此异常。

InvalidCharacterError DOMException

如果 qualifiedName 值不是有效的 XML 名称，则会抛出此异常；例如，它以数字、连字符或句点开头，或者包含除字母数字字符、下划线、连字符或句点以外的其他字符。

重要命名空间 URI

HTML

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

SVG

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

MathML

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

示例

这将在 XHTML 命名空间中创建一个新的 <div> 元素，并将其附加到 vbox 元素。虽然这不是一个非常有用的 XUL 文档，但它确实演示了如何在单个文档中使用来自两个不同命名空间的元素。

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>

注意： 上面的示例使用内联脚本，这在 XHTML 文档中不推荐。这个特定示例实际上是一个包含嵌入式 XHTML 的 XUL 文档，但是，该建议仍然适用。

规范

规范
DOM 标准
# ref-for-dom-document-createelementns①

浏览器兼容性

BCD 表格仅在启用 JavaScript 的浏览器中加载。

另请参阅