XML解析vs DOM实现创建方法

XML Parsing vs DOM Implementation create methods

本文关键字：创建 方法 实现 DOM 解析 vs XML      更新时间：2023-09-26

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

是否同样适用于使用JavaScript编写XML文档?与其使用DOM实现的各种create方法，不如直接生成XML字符串并对其进行解析，这样会更快吗?

只是我想知道....:)

*EDIT -添加示例*

哪个更快?(我将使用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"));

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

我在Firefox 7中使用Firebug进行了测试。代码: 

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。所以字符串解析版本比较慢。

更新2 很可能第二个版本在其他浏览器中也会更快。因为解析方法也必须构建DOM对象，并且很可能使用相同的方法(例如:document.createElement)。所以parse方法不能更快。但是它比较慢，因为它首先要解析字符串

相关文章：