使用Jquery查找XML元素值

时间:2012-09-04 03:49:38

标签: jquery xml ajax

我有一个XML文件,我需要使用Jquery和Ajax找到特定PK的项目 到目前为止,我了解了这个对象,但我有两个问题:

  1. 有没有比做循环找到pk值更好的想法?
  2. XML很大,我需要知道是否有更好的方法来查询它而不是将其加载到内存中,XSLT能帮助更好吗?或者反正比jquery更好吗?
  3. 这是我的代码

    $.ajax({
        url: 'xml/products.xml',
        dataType: 'html',
        success: function(xml) {
            $(xml).find('pk').each(function() {
                if ($(this).text() == "1")
                //do something
            });
        }
    });
    

    这是我的xml

    <products>
    <item>
        <pk>1</pk>
        <name>test</name>
    </item>
    <item>
        <pk>2</pk>
        <name>test2</name>
    </item>
    <item>
        <pk>3</pk>
        <name>test3</name>
    </item>
    <item>
        <pk>4</pk>
        <name>test4</name>
    </item>
    </products>
    

2 个答案:

答案 0 :(得分:4)

首先,您必须编写正确的XML字符串,就像您必须完成/结束最后一个已启动的相同标记一样。在上面的示例代码中,您在关闭时出错了。这是错误的xml语法。请进行如下修正:     1     测试

这里我已经在解析XML数据或标签的样本箱上做了,而不是Ajax我只是在按钮点击事件上解析xml数据,因为在箱子上Ajax调用不能调用外部文件。

这是演示: http://codebins.com/bin/4ldqp7u

<强> HTML

<div>
  <input type="button" id="btnxml" value="Get XML Data" />
  <input type="button" id="btnreset" value="Reset" style="display:inline"/>
  <div id="result">
  </div>
</div>
<div id="xmldata">
  <products>
    <item>
      <pk>
        1
      </pk>
      <name>
        test
      </name>
    </item>
    <item>
      <pk>
        2
      </pk>
      <name>
        test2
      </name>
    </item>
    <item>
      <pk>
        3
      </pk>
      <name>
        test3
      </name>
    </item>
    <item>
      <pk>
        4
      </pk>
      <name>
        test4
      </name>
    </item>
  </products>
</div>

<强> JQuery的:

$(function() {
    $("#btnxml").click(function() {
        var xml = "<rss version='2.0'>";
        xml += $("#xmldata").html();
        xml += "</rss>";
        var xmlDoc = $.parseXML(xml),
            $xml = $(xmlDoc);

        var result = "";
        if ($xml.find("item").length > 0) {

            result = "<table class='items'>";
            result += "<tr><th>PK</th><th>Name</th></tr>";

            $xml.find("item").each(function() {
                result += "<tr>";
                result += "<td>" + $(this).find("pk").text() + "</td>";
                result += "<td>" + $(this).find("name").text() + "</td>";
                result += "</tr>";
            });

            result += "</table>";
            $("#result").html(result);
        }


    });

    //Reset Result 
    $("#btnreset").click(function() {
        $("#result").html("");
    });

});

<强> CSS:

#xmldata{
  display:none;
}
table.items{
  margin-top:5px;
  border:1px solid #6655a8;
  background:#55a5d9;
  width:20%;
}
table.items th{
  border-bottom:1px solid #6655a8;
}
table.items td{
  text-align:center;
}
input[type=button]{
  border:1px solid #a588d9;
  background:#b788d9;
}

演示: http://codebins.com/bin/4ldqp7u

答案 1 :(得分:1)

至少,您可以使用比“pk”更具体的查询。在此示例中,$(xml).find("products item pk")应该更快。