Question

我一直在使用jQuery创建HTML元素，然后将它们添加到XML文档中，如下所示：

var doc = $($.parseXML('<?xml version="1.0" encoding="UTF-8"?><root/>'));
var docRoot = doc.find("root");
var childEl = $("<child>");
docRoot.append(childEl);
var imageEl = $("<image>");
docRoot.append(imageEl);

var xmlString = doc.context.xml || 
                new XMLSerializer().serializeToString(doc.context);
$("#xml").text(xmlString);

这是输出（在Chrome 24上）：

<?xml version="1.0" encoding="UTF-8"?>
<root>
  <child xmlns="http://www.w3.org/1999/xhtml"></child>
  <img xmlns="http://www.w3.org/1999/xhtml" />
</root>

Here's the JSFiddle link.不幸的是，我遇到了两个问题。

当我尝试创建名为child的元素时，它会正确创建一个tagName为child的元素。但是，如果我使用名称image，由于某种原因，jQuery认为我想创建一个img元素。如何阻止jQuery执行此操作？
所有子元素都会自动添加属性xmlns="http://www.w3.org/1999/xhtml"，即使我生成的文档不是XHTML文档。如何阻止这种情况发生？

更新

图像tagName问题似乎是DOM的问题，而不是jQuery，正如this code所示：

var el = document.createElement("image");
$("#output").append(el.tagName); // Outputs "IMG"

Answer 1

image是img的同义词。 document.createElement('image')实际创建了img元素，就像我在this question中解释的那样。

尽管如此，所有的希望都不会丢失。将HTML / XML字符串传递给要解析的元素的jQuery，the second argument is the owner document时。

由于您已在第一步中创建了XML文档对象，我相信

var imageEl = $("<image />", doc[0]);

将使用XML文档的createElement方法并创建正确的元素。

注意：在内部jQuery uses jQuery.parseHTML when passed such a string，因此此方法可能无法始终有效。看起来虽然jQuery一直使用传入的文档（context）。它当然适用于单个标签。

更安全（也许更容易？）可能只是使用：

var imgeEl = $(doc[0].createElement('image'));

jQuery为图像标记创建了不正确的元素

1 个答案: