Question

请您查看我的JavaScript并告诉我是否有更有效的方法来编写循环浏览XML？

我的JavaScript代码如下所示：

<script type="text/javascript">
function loadXMLDoc(dname)
{
    xhttp=new XMLHttpRequest();
    xhttp.open("GET",dname,false);
    xhttp.send();
    return xhttp.responseXML;
} 

var xmlDoc=loadXMLDoc("building.txt");

x=xmlDoc.getElementsByTagName('Building');

for (i=0;i<x.length;i++)
{
    txt=xmlDoc.getElementsByTagName('Building')[i].getAttribute('Name');

    document.write(txt + "<BR>");    

    y=x[i].getElementsByTagName('Tenant');

    for (j=0;j<y.length;j++)
    {
        txt1=x[i].getElementsByTagName('Tenant')[j].getAttribute('DISPLAYNAME');
        document.write("> " + txt1 + "<BR>");
    }

    document.write("<HR>");
}

我的XML数据看起来像这样 - 我将其粘贴在PasteBin中... http://pastebin.com/nhMHjCjP

Answer 1

使用缓存优化版本：



function loadXMLDoc(dname)
{
    xhttp=new XMLHttpRequest();
    xhttp.open("GET",dname,false);
    xhttp.send();
    return xhttp.responseXML;
} 
var xmlDoc=loadXMLDoc("building.txt");
var buildingTags = xmlDoc.getElementsByTagName('Building');
for (i=0,l=buildingTags.length;i<l;i++){
    txt=buildingTags[i].getAttribute('Name');
    document.write(txt + "<BR>");    
    var y=buildingTags[i].getElementsByTagName('Tenant');
    for (j=0,l1=y.length,j<l1;j++){
        txt1=y[j].getAttribute('DISPLAYNAME');
        document.write(" > " + txt1 + "<BR>");
    }
    document.write("<HR>");
}

Answer 2

反向循环在这里不起作用，因为顺序会有所不同（如果这对你很重要），但你可以通过缓存变量来提高循环性能：
```
for (i=0; i<x.length; i++)  ->   for (var i=0,n=x.length; i<n; i++)
for (j=0; j<y.length; j++)  ->   for (var j=0,m=y.length; j<m; j++)
```
不是调用多个独立的document.write，而是构建字符串并调用一个字符串更快。
如果这是一个HTML页面，最好不要调用它，document.write有些过时，最好使用元素的.innerHTML或以另一种方式附加它。

Answer 3

更改为而

var i = length; while(i--){...};

我相信而比javascript中的循环快得多

Answer 4

这里最慢的功能可能是xmlDoc.getElementsByTagName次呼叫。只为您正在查找的每个标记调用xmlDoc.getElementsByTagName，而不是两个。然后，您可以在for循环中使用它并访问该元素。因此：第二次提及x时使用xmlDoc.getElementsByTagName('Building')，并在第二次提及y时使用x[i].getElementsByTagName('Tenant')。这将为您带来最大的加速

另一项更改将简化您的代码并允许您更轻松地进行优化（但本身可能没有太多的加速）：您可以创建一个数据结构来保存数据，而不是为文档构建DOM元素。这也将使调试更容易。稍后，它将帮助您隔离性能问题 - 现在，即使使用分析器，也很难判断它们对XML文档的解析是否缓慢或是否构建了新的DOM节点。

因此：

  var buildings = []; // add this
  for(...)
    txt=x[i].getAttribute('Name');
    // SKIP: document.write(txt + "<BR>");    

    y=x[i].getElementsByTagName('Tenant');
    var tenants = []; 
    for (j=0;j<y.length;j++)
    {
        txt1=y[j].getAttribute('DISPLAYNAME');
        tenants.push(txt1); // instead of: document.write("> " + txt1 + "<BR>");
    }
    buildings.push({ name: txt, tenants: tenants });

现在你有了更清晰的“导入”代码。并且您有一个很好的数据结构来生成DOM节点。

Answer 5

看看我发给自己问题的答案。

https://stackoverflow.com/a/17057095/2439211

我成功创建了一个带有if else语句的for循环，它将搜索xml并在表中显示结果。如果未找到任何结果，则会显示一条消息，指出未找到联系人。

在JavaScript中循环以更有效地显示XML数据的方法？

5 个答案: