Question

我有以下使用jquery解析的xml。

但是我只是在显示按标题分组的城市和日期。如何解析xml以使最终输出像这样

测试活动1 - 奥斯陆（2011/08/11），达拉斯（2011/11/11）

测试赛事2 - 纽约（...），西雅图（......）

任何帮助将不胜感激，

谢谢，特里

<root>
    <item guid="np_108886">
        <title>Test event 1</title>
        <description>lorem ipsum</description>
        <specfields>
            <city>oslo</city>
            <startdate>2011/08/11</startdate>
        </specfields>
    </item>

    <item guid="np_108886">
        <title>Test event 1</title>
        <description>lorem ipsum</description>
        <specfields>
            <city>dallas</city>
            <startdate>2011/11/11</startdate>
        </specfields>
    </item>

    <item guid="np_108886">
        <title>Test event 2</title>
        <description>lorem ipsum</description>
        <specfields>
            <city>new york</city>
            <startdate>2011/09/11</startdate>
        </specfields>
    </item>
    <item guid="np_108886">
        <title>Test event 2</title>
        <description>lorem ipsum</description>
        <specfields>
            <city>seattle</city>
            <startdate>2011/09/11</startdate>
        </specfields>
    </item>
</root>

Answer 1

http://jsfiddle.net/XnmNU/6/ - 工作jFiddle {编辑儿童选择器！}

我的版本将上一个标题与当前标题进行比较，以确定它是否是一个欺骗，抱歉我没有时间绝对优化我在工作的代码：（

输出＆GT; 开始测试活动1 - 奥斯陆（2011/08/11）达拉斯（2011/11/11）测试活动2 - 纽约（2011/09/11）西雅图（2011/09/11）

$("document").ready(function(){
    var xml = "<root>     <item guid='np_108886'>         <title>Test event 1</title>         <description>lorem ipsum</description>         <specfields>             <city>oslo</city>             <startdate>2011/08/11</startdate>         </specfields>     </item>      <item guid='np_108886'>         <title>Test event 1</title>         <description>lorem ipsum</description>         <specfields>             <city>dallas</city>             <startdate>2011/11/11</startdate>         </specfields>     </item>      <item guid='np_108886'>         <title>Test event 2</title>         <description>lorem ipsum</description>         <specfields>             <city>new york</city>             <startdate>2011/09/11</startdate>         </specfields>     </item>     <item guid='np_108886'>         <title>Test event 2</title>         <description>lorem ipsum</description>         <specfields>             <city>seattle</city>             <startdate>2011/09/11</startdate>         </specfields>     </item> </root>",     xmlDoc = $.parseXML( xml ); xml = $(xmlDoc);

    try
  {
  $(xml).find('[nodeName=item]').each(function(){    if ($(this).index() != 0) {
      possitionTitle = $(this).prev();
     if ($(this).children('title').text() != possitionTitle.children('title').text() ) {
                $("div").append("</li><li>"+$(this).children('title').text()+" -- "+$(this).children("specfields").children("city").text()+" ("+$(this).children("specfields").children("startdate").text()+")");
                } else {
                    $("div").append($(this).children("specfields").children("city").text()+" ("+$(this).children("specfields").children("startdate").text()+")");
                }
        } else {
            $("div").append("Start<li>"+$(this).children('title').text()+" -- "+$(this).children("specfields").children("city").text()+" ("+$(this).children("specfields").children("startdate").text()+")");
        }
        $("div").append("</li>");

    });

  }
catch(err)
  {
  alert(err);
  }

});
<div></div>

Answer 2

这样的事情应该有效（未经测试）：

$(document).ready(function()
{
  $.ajax({
    type: "GET",
    url: "YOUR XML",
    dataType: "xml",
    success: parseXml
  });
});

function parseXml(xml){
    $(xml).find("title").filter(function(){
                $(this).text() == "Test event 1";
         }).each(function(){
             $("#dataDiv").append($(this).find("city").text();
             $("#dataDiv").append("(" + $(this).find("startdate").text() + "),");
     });

     $(xml).find("title").filter(function(){
                $(this).text() == "Test event 2";
         }).each(function(){
             $("#dataDiv").append($(this).find("city").text();
             $("#dataDiv").append("(" + $(this).find("startdate").text() + "),");
     });  

}

其中#dataDiv和#dataDiv2是页面上的div，其中只有测试事件1 或测试事件2 。

Answer 3

希望这会有所帮助。我测试并创建了一个js小提琴：http://jsfiddle.net/xDqZK/

基本上，一旦你在javscript中拥有了xml，就可以使用jquerys parseXML（）函数将它放入jquery对象中。进入对象后，您可以使用$ .find（）方法搜索不同的节点并在其中进行迭代。一个棘手的问题，如果你想获得一个节点的价值，你需要使用.text（）。我使用的是返回undefined的.val（）和.hmtl（）。

var strXml ="<root><item guid=\"np_108886\"><title>Test event 1<\/title><description>lorem ipsum<\/description><specfields><city>oslo<\/city><startdate>2011\/08\/11<\/startdate><\/specfields><\/item><item guid=\"np_108886\"><title>Test event 1<\/title><description>lorem ipsum<\/description><specfields><city>dallas<\/city><startdate>2011\/11\/11<\/startdate><\/specfields><\/item><item guid=\"np_108886\"><title>Test event 2<\/title><description>lorem ipsum<\/description><specfields><city>new york<\/city><startdate>2011\/09\/11<\/startdate><\/specfields><\/item><item guid=\"np_108886\"><title>Test event 2<\/title><description>lorem ipsum<\/description><specfields><city>seattle<\/city><startdate>2011\/09\/11<\/startdate><\/specfields><\/item><\/root>";
var xml = $.parseXML(strXml);

$("#test").html((parse(xml,"Test event 1")));

function parse(xml, strEvent)
{
    var eventStr = "",$xml = $(xml);
    $xml.find("item").each(function(){
        if($(this).find("title").text().toLowerCase() == strEvent.toLowerCase()){
           var childNode = $(this).find("specfields")
           eventStr += childNode.find("city").text();
           eventStr += " (" + childNode.find("startdate").text() + ") ";
        }
    });
    return eventStr;
}

HTML

<div id="test></div>

jquery解析xml并按元素值分组

3 个答案: