Question

我记得很清楚，使用DOM实现在文档上创建新的HTML元素被认为比将HTML字符串分配给适用的HTML元素的'innerHTML'属性慢得多。

使用JavaScript创作XML文档时是否同样适用？而不是使用DOM实现的各种创建方法，只是生成XML字符串并解析它会更快吗？

我想知道的事情......：）

*编辑 - 添加了一个示例*

哪个更快？（我将使用jQuery的parseXML函数来执行解析示例）：

var myXdoc = $.parseXML("<person><name>Bob</name><relation>Uncle</relation>");

或者

var myXdoc

if (window.ActiveXObject) {
    myXdoc = new ActiveXObject("Microsoft.XMLDOM");
    myXdoc.async = false;
}
else if (document.implementation && document.implementation.createDocument)
    myXdoc = document.implementation.createDocument("", "", null);

var p = myXdoc.documentElement.appendChild(myXdoc.createElement("person"));
var n = p.appendChild(myXdoc.createElement("name"));
n.appendChild(myXdoc.createTextNode("Bob"));
var r = p.appendChild(myXdoc.createElement("relation"));
r.appendChild(myXdoc.createTextNode("Uncle"));

Answer 1

首先我们必须知道为什么createDocument()可能会很慢。原因是DOM处于活动状态，如果您正在修改它，它会触发DOM树的重新验证，并可能重新绘制站点。每次。但是我们可以使用createDocumentFragment()来避免这种不必要的重新验证并重新绘制。 DocumentFragment不是DOM的一部分，因此它不会触发任何事件。因此，您可以构建完整的DOM部分，并在最后一步将其附加到DOM树。我认为这是创建大型DOM部件的最快方法。

<强>更新我使用Firebug在Firefox 7中测试了它。代码：

console.time("a");
for(var i=0; i<1000; i++) {
$.parseXML("<person><name>Bob</name><relation>Uncle</relation></person>")
}
console.timeEnd("a");

console.time("b");
for(var i=0; i<1000; i++) {
var myXdoc
if (document.createDocumentFragment) {
    myXdoc = document.createDocumentFragment();
}
var p = myXdoc.appendChild(document.createElement("person"));
var n = p.appendChild(document.createElement("name"));
n.appendChild(document.createTextNode("Bob"));
var r = p.appendChild(document.createElement("relation"));
r.appendChild(document.createTextNode("Uncle"));
}
console.timeEnd("b");

结果：“a”约为140ms，“b”约为35ms。所以字符串解析版本较慢。

<强> UPDATE2 第二种变体很可能在任何其他浏览器中都更快。因为parse方法也必须构建DOM对象，并且它很可能使用相同的方法（例如：document.createElement）。所以解析方法不能更快。但它的速度较慢，因为它首先要解析字符串。

XML解析与DOM实现创建方法

1 个答案: