具有 xmlns 的元素与使用具有相同 namespaceURI 的 createElementNS 创建的元素有何不同？答案

【问题标题】：How is an element with xmlns different from one created with createElementNS with the same namespaceURI?具有 xmlns 的元素与使用具有相同 namespaceURI 的 createElementNS 创建的元素有何不同？
【发布时间】：2021-09-28 14:39:17
【问题描述】：

假设我们有以下 XML：

<ns:xml xmlns:ns="AAA">
  <predefined xmlns="AAA"/>
</ns:xml>

在浏览器中运行以下代码时：

const doc = new DOMParser().parseFromString(XML, 'text/xml');

const added = doc.createElementNS('AAA', 'added');
doc.documentElement.appendChild(added);

只是序列化added 返回<added xmlns="AAA"/> 但是在序列化doc 时，结果是

<ns:xml xmlns:ns="AAA">
  <predefined xmlns="AAA"/>
  <a:added />
</ns:xml>

为什么predefined 和added 的行为不同？或者反过来问：如何使用 createElementNS（和其他 DOM API）创建像 predefined 这样的元素？

【问题讨论】：

标签： xml dom mime-types xml-namespaces

【解决方案1】：

要使added 的行为类似于predefined，您需要将xmlns 属性显式设置为与namespaceURI 参数相同的命名空间：

const added = doc.createElementNS('AAA', 'added');
added.setAttribute('xmlns', 'AAA');
doc.documentElement.appendChild(added);

另外请注意，使用 mime 类型 text/html 对其进行解析会更改（解析和）序列化的行为，从而导致以下结果：

<ns:xml xmlns:ns="AAA">
  <predefined xmlns="AAA"></predefined>
  <added xmlns="AAA"></added>
</ns:xml>

【讨论】：