0

XML、html、javascript の初心者です。HTML のすべてのタイトル要素を取得して連結するコードをいくつか書きましたが、出力を思い通りに表示できません。誰かが私のコードを見て、コードを修正する方法についてのヒントを教えてもらえますか? よろしくお願いいたします。

Current: result: 行ってみたい都市東京、日本サントルニ、ギリシャ、シカゴ、アメリカ

次のようなものが欲しいです：

  • 結果：
  • 行ってみたい都市
  • 東京、日本
  • サントリーニ島、ギリシャ
  • シカゴ、米国

XML ファイルは次のとおりです。

<?xml version="1.0"?>
<rss version="0.92">
  <channel>
      <title>Cities I Want to Visit</title>
      <link>http://pinterest.com/manicmonster/cities-i-want-to-visit</link>
      <Description>I love traveling!</Description>
      <item>
          <title>Tokyo, Japan</title>
          <link>http://www.gotokyo.org/en</link>
      </item>
      <item>
          <title>Santorini, Greece</title>
          <link>http://www.visitgreece.gr/en/greek_islands/santorini</link>
      </item>
      <item>
          <title>Chicago, USA</title>
          <link>http://www.cityofchicago.org/city/en.html</link>
      </item>
      <item>
          <title>Rome, Italy</title>
          <link>http://www.turismoroma.it/?lang=en</link>
      </item>
  </channel>
</rss>

html ファイルは次のとおりです。

<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
  <title>Practice</title>
  <meta charset="UTF-8">  
</head>
  <body>
    <div id="clickme" onclick="startAjax()">Click me</div>
    <script>
        function startAjax(){
          $("#clickme").text("Calling server");
          $.ajax({url:"test.xml",       
          success:callbackFunction, error:errorFunction});
        }

        function callbackFunction(data,info){
          var titles = $(data).find("title:first");
          var items = $(data).find("item title");

          if (titles && titles.length)
            $("#clickme").text("result: " + titles.text() + " " + items.text());
          else
            errorFunction(data, "No titles");
          }

        function errorFunction(data,info){
          $("#clickme").text("error occurred:"+info);
        }
    </script>
  </body>
</html>
4

2 に答える 2

0 
var items = $(data).find("item title");

この行は、xml ノードのコレクションを取得します。後でコードがこの行を実行すると:

items.text()

コレクションを受け取り、カンマ区切りの値の文字列を返します。(例: 東京、日本、サントリーニ、ギリシャ、シカゴ、アメリカ、ローマ、イタリア)

Malkが示唆するように、ループを使用して個々の値を取得し、それらをリストに追加する必要があります。その例を使用するかeach、コレクションで jQuery メソッドを使用できます

html = "";
items.each(function(index, value) { 
   html += "<li>" + value + "</li>";
});

もちろん、箇条書きリストが必要だと仮定します。しかし、コレクションを繰り返し処理する方が、目的に近いように見えるという考えは当てはまります。

于 2013-07-15T23:03:18.373 に答える
0 
function callbackFunction(data,info){
  var titles = $(data).find("title:first"),
      items = $(data).find("item").reverse(),
      items_idx = items.length,
      html= "";

  while (items_idx--){
      var txt = items[items_idx].find("title").text(),
          url = items[items_idx].find("link").text();

      html += "<li><a href='" + url + "'>" + txt + "</a></li>";
  }
  if (titles && titles.length)
    $("#clickme").text("result: " + titles.text() + " <ul>" + html + "</ul>");
  else
    errorFunction(data, "No titles");
}
于 2013-07-15T22:34:43.973 に答える