有其他方法吗？

你也许会想：“那javascript变得相当复杂了，但它只会随着XML越来越复杂而跟着变复杂，也许我们能够简化XML，然后，简化javascript”。如果你这么想，很棒，因为你完全正确。我之前展示的不同方法之一，我详细说明的那个也许能够成为最合适的。我们怎么使用属性来对应每一只宠物以及相应任务？XML看起来会变成怎样？

<?xml version="1.0" encoding="UTF-8"?>
<data>
  <pets>

<pet type="Cat" tasks="Feed, Water, Comb out fleas" />

<pet type="Dog" tasks="Feed, Water, Put outside" />

<pet type="Fish" tasks="Feed, Check oxygen, water purity, etc." />
  </pets>
</data>

哇哦！看起来简单多了。让我们看看我们的processXML函数如何修改：

  function processXML(obj){

var dataArray = obj.getElementsByTagName('pet');

var dataArrayLen = dataArray.length;

var insertData = '<table><tr><th>'
 　　+ 'Pets</th><th>Tasks</th></tr>';

for (var i=0; i<dataArrayLen; i++){
    　　insertData += '<tr><td>' + dataArray[i].getAttribute('type')         　　+ '</td>'
+ '<td>' + dataArray[i].getAttribute('tasks') + '</td></tr>';

}

insertData += '</table>';

document.getElementById ('dataArea').innerHTML = insertData;
}

（Sheneyan注：修改后的示例见：example_2_4.html，XML文件见：data_2_4.xml）

就像你猜的一样，函数简单多了。因为代码变得简单，它也会变得更有效率。和我们比较老的函数的唯一的不同在于这个变量insertData现在插入更多的HTML，尤其是两个新变量“type”和“tasks”。就如我们较早之前所学的，那些属性是我们从XML文档的<pet>元素中取得的，而且每个pet的属性都有不同的值。对于你自己修改这个XML文件以适应你的进度的变动来说也许是最简单的方法。例如，如果你最终把你的猫身上的跳蚤抓光了，你只要简单从你的猫的每日任务表中把“减少跳蚤数量”删除，然而在之前我们使用的XML中，实现起来也许会觉得糊里糊涂。

最后的XML格式化的方法是将两部分混合。现在，我们将使用属性和不同的标签。让我们看一下示例XML：

<?xml version="1.0" encoding="UTF-8"?>
<data>
  <pets>

<猫 tasks="喂食, 饮水, 减少跳蚤数量" />

<狗 tasks="喂食, 饮水, 带出去遛遛" />

<鱼 tasks="喂食, 检查氧气，水的纯度，其它" />
  </pets>
</data> 

这也许是最便于理解的XML。让我们分析一下我们为了让processXML函数运作起来所作的变更：

function processXML(obj){

var dataArray = obj.getElementsByTagName('pets')[0].childNodes;

var dataArrayLen = dataArray.length;

var insertData = '<table><tr><th>'
 　　+ 'Pets</th><th>Tasks</th></tr>';

for (var i=0; i<dataArrayLen; i++){
  　　if(dataArray[i].tagName){
    　　insertData += '<tr><td>' + dataArray[i].tagName + '</td>'
        　　+ '<td>' + dataArray[i].getAttribute('tasks') + '</td></tr>';
  　　}
  }
  insertData += '</table>';
  document.getElementById ('dataArea').innerHTML = insertData;
}

（Sheneyan注：修改后的示例见：example_2_5.html，XML文件见：data_2_5.xml）

“dataArray”现在指向了<pets>的子节点，将它们作为一个数组对待（换句话说，dataArray现在是在<pets>节点内所有节点的数组）。这事因为每一个标签都不同（<猫 />，<狗 />，<鱼 />），所以我们不能使用这些元素的名称来搜索它们（而之前我们可以使用<pet>，因为所有的元素都是<pet>）。

还是一样，每个节点之间的有空格，所以在我们的处理过程中得排除掉文本节点。我们能够检验标签名是否存在－文本节点是节点但没有标签，而<猫 />，<狗 />，<鱼 />节点都是标签。所以如果一个标签有名字，那我们能够将数据插入变量insertData。我们插入的数据是一个表格并有两个表格数据格。这第一个单元格是标签名，也就是宠物的类型（猫，狗或鱼），而第二个单元格则是指定动物的“tasks”属性值（比如“喂食或饮水”）。

结束语

在这篇文章里，我演示了这个例子的很多变化，你可以随意试验它们来检验哪个更适合你。只要记住一点，XML是“可扩展的”，所以没有“错误的”方法来组合你的数据，虽然经常有一个“最好的”方法。而且，要注意让你的XML保持格式良好。记住很多问题来自于忘记结束一个标签（比如<狗 />而不是<狗>;除非这个节点中有数据，比如下面的<狗>这里有数据哦</狗>）。

我意图使XML和javascript的应用不糊涂而变得明朗。一步步的学习处理更多的数据，你能够将ajax运用于更大的用途。我希望看到ajax更多的应用于企业网站，及其它。所以如果你将这些知识应用于实践，我很高兴了解到你学到了什么（mail：jona#slightlyremarkable.com #换成@）。

关于作者

Jonathan Fenocchi(mail：jona#slightlyremarkable.com #换成@)是一个网络开发者，主攻web设计，客户端脚本，php脚本。

他的网站位于http://www.slightlyremarkable.com

（Sheneyan注：完整代码示例见 example_2.html ，XML文件见：data_2.xml）