0

所以我有一个包含一些数据的 XML 文件。我试图抓住它并将其作为 HTML 表格输出到另一个页面上。找到了一块 jQuery,但它似乎不起作用。有人可以帮我解决它或提出替代解决方案吗?

索引.html

<html>
<body>

<table id="data"></table>

<script src="jquery.js"></script>
<script>
$(document).ready(function(){
    $.ajax({
        type: "GET",
        url: "data.xml", 
        dataType: "xml",
        success: function(xml) {  
            $(xml).find('flight').each(function(){    
                var Col0 = $(this).find('flightid').text();
                var Col1 = $(this).find('departure_aerodrome').text();
                var Col2 = $(this).find('departure_time').text();
                $('<tr></tr>').html('<th>'+Col0+'</th><td>$'+Col1+'</td><td>$'+Col2+'</td>').appendTo('#data');
            });
        }
    });
});
</script>

</body>
</html>

数据.xml

<?xml version="1.0" encoding="UTF-8"?>
<data>
  <departures>
    <flight>
      <flightid>1234</flightid>
      <departure_aerodrome>Paris</departure_aerodrome>
      <departure_time>1035</departure_time>
      <remark>Started at 10:36</remark>
    </flight>
    <flight>
      <flightid>2345</flightid>
      <departure_aerodrome>Paris</departure_aerodrome>
      <departure_time>1725</departure_time>
      <remark />
    </flight>
    <flight>
      <flightid>3456</flightid>
      <departure_aerodrome>Paris</departure_aerodrome>
      <departure_time>2045</departure_time>
      <remark />
    </flight>
  </departures>
  <arrivals>
    <flight>
      <flightid>4567</flightid>
      <arrival_aerodrome>Paris</arrival_aerodrome>
      <arrival_time>1013</arrival_time>
      <remark>Landed at 10:18</remark>
    </flight>
    <flight>
      <flightid>5678</flightid>
      <arrival_aerodrome>Paris</arrival_aerodrome>
      <arrival_time>1707</arrival_time>
      <remark />
    </flight>
    <flight>
      <flightid>6789</flightid>
      <arrival_aerodrome>Paris</arrival_aerodrome>
      <arrival_time>2014</arrival_time>
      <remark />
    </flight>
  </arrivals>
</data>
4

1 回答 1

0

看起来你没有包含 jQuery 库

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>

<table id="data"></table>

<script>
$(document).ready(function(){
    $.ajax({
        type: "GET",
        url: "data.xml", 
        dataType: "xml",
        success: function(xml) {  
            $(xml).find('flight').each(function(){    
                var Col0 = $(this).find('flightid').text();
                var Col1 = $(this).find('departure_aerodrome').text();
                var Col2 = $(this).find('departure_time').text();
                $('<tr></tr>').html('<th>'+Col0+'</th><td>$'+Col1+'</td><td>$'+Col2+'</td>').appendTo('#data');
            });
        }
    });
});
</script>

</body>
</html>

演示:小提琴

于 2013-11-13T11:37:21.997 回答