如何使用JQuery解析XML文件以更新HTML表

Question

我需要解析将采用某种格式的XML文件，然后计算主队或客队是否获胜，然后将3点或1点分配给由结果确定的HTML表格（总分列），我更喜欢使用jQuery为此。

results.xml代码：

<?xml version="1.0"?>
<title>Results</title>
  <results>
    <result id="1234">
      <hometeam>
        <name>Roma</name>
        <score>2</score>
      </hometeam>
      <awayteam>
        <name>Lazio</name>
        <score>0</score>
      </awayteam>
  </result>
</results>

HTML代码：

<table id="table">
<th>Team</th>
<th>Played</th>
<th>Won</th>
<th>Drawn</th>
<th>Lost</th>
<th>Total Goals</th>
<th>Overall Points</th>

<tr>
<td>Roma</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
</tr>
<tr>
<td>Lazio</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
</tr>
<tr>
<td>Inter</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
</tr>
<tr>
<td>Milan</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
<td>0</td>
</tr>
</table>

jQuery代码：

function showData() {
$.ajax({
type: "GET",
url: "results.xml",
dataType: "xml",

到目前为止，我已经掌握了JQuery代码。

计算出来的结果会去哪儿？

if (hometeam score > awayteam score)
{ add 3 to hometeams Overall Points}
else if (hometeam score = awayteam score)
{ add 1 to hometeams Overall Points and add 1 to awayteams Overall Points}
else 
{ add 3 to awayteams Overall Points}

我将如何评估主队和客队得分并在HTML表格中更新正确的球队？

谢谢您的帮助。

Answer 1

当然，您可以使用JavaScript来解析xml，例如使用jQuery的parseXML函数。 http://api.jquery.com/jQuery.parseXML/

但是，这可能很慢，因为最终用户每次访问页面时都必须解析一个大文件。 XML文件往往很庞大。

相反，我会先将XML转换为JSON或数据库行。

PHP具有大多数发行版附带的名为Simple XML Parser的库。 该界面确实非常简单。 Python还具有一个称为lxml的丰富库来解析XML。

当然，如果您真的想用javascript解析XML，那么我认为这个问题很有帮助。 使用jQuery和HTML在XML数据之间分页

Answer 2

当您比较ajax调用时

$.ajax({
type: "GET",
url: "results.xml",
dataType: "xml",

在jquery文档中的示例中，您会看到缺少的内容。 您的通话如下所示：

$.ajax({
  url: "results.xml",
  dataType: "xml",
  type: "GET",
  success: function(data){
    // do something with data
  }
});

您需要指定一个函数，如果成功返回数据，该函数将被调用。 在上面的示例中，该函数是一个匿名函数。 您还可以使用具有以下名称的普通函数：

function handle_success(data){
    // do something with data
}

$.ajax({
  url: "results.xml",
  dataType: "xml",
  type: "GET",
  success: handle_success
});

但是要当心AJAX中的A：它代表异步。 这意味着：您的成功功能将在以后被调用，甚至永远不会被调用。 ajax调用后，程序的其余部分将照常继续。