使用 jQuery 从 XML 提要中处理数据答案

【问题标题】：Manipulating Data from an XML feed using jQuery使用 jQuery 从 XML 提要中处理数据
【发布时间】：2011-10-19 05:08:10
【问题描述】：

我正在使用 jQuery 获取 XML 数据并将其包含在 HTML 文件中，但我在尝试操作格式时有点卡住了。

请允许我提供更多关于我在做什么的数据：

我有一些 jQuery 来获取外部 XML：

<script type="text/javascript">
<!--
jQuery.fn.xml=function(a){
    var b="";
    if(this.length)(typeof a!="undefined"&&a?this:jQuery(this[0]).contents()).each(function(){
        b+=window.ActiveXObject?this.xml:(new XMLSerializer).serializeToString(this)});
        return b
    }
    $(document).ready(function(){
        $('div.cnetxml').each(function(index) {
            var var_url = $(this).attr('data');
            var var_digcontent_name = $(this).attr('id');
            var obj_divcnetxml = $(this);
            $.getJSON("http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%3D%22"+encodeURIComponent(var_url)+"%22&format=xml'&callback=?",function(data){
                if(data.results[0]){
                    var data = data.results[0];
                    obj_divcnetxml.html($( $.parseXML( data ) ).find( "ul" ).xml());
                    };
                    obj_divcnetxml.removeClass('hide');
                }
            }
        );                                
    });
});
-->
</script>
<div class="cnetxml hide" data="http://cdn.cnetcontent.com/30/7f/307f280c-15f2-4e3e-9391-4e09c9ecc450.xml" id="cnet_DigitalContentProductDescription"> </div>

Check out the XML file查看格式。

生成的格式与此类似，但没有无序列表包装标签：


<li>Item 01 Header</li>
<li>Item 01 Description</li>
<li>Item 02 Header</li>
<li>Item 02 Description</li>
<li>Item 03 Header</li>
<li>Item 03 Description</li>
…and so on

列表项出现在标题/描述对中，我想将这些对组合成以下格式：


<li><strong>Item 01 Header</strong><br />
Item 01 Description</li>
<li><strong>Item 02 Header</strong><br />
Item 02 Description</li>
<li><strong>Item 03 Header</strong><br />
Item 03 Description</li>

另外，我需要将列表包装在适当的<ul> 标记中。

任何聪明的 jQuery 人都可以抽出时间提供帮助。我会举手的，我不太擅长这些东西。

【问题讨论】：

您确定要获取 XML 吗？因为它看起来像 HTML……除非它是 XHTML，在这种情况下它的格式是正确的，你应该没问题。
嘿 Vivin，我已经编辑了我的原始陈述以更好地描述我在做什么。我希望这对你有用。

标签： jquery xml list jsonp

【解决方案1】：

这是有效的完整代码。

<script type="text/javascript">
<!--
jQuery.fn.xml=function(a){
    var b="";
    if(this.length)(typeof a!="undefined"&&a?this:jQuery(this[0]).contents()).each(function(){
        b+=window.ActiveXObject?this.xml:(new XMLSerializer).serializeToString(this)});
        return b
    }
    $(document).ready(function(){
        $('div.cnetxml').each(function(index) {
            var var_url = $(this).attr('data');
            var var_digcontent_name = $(this).attr('id');
            var obj_divcnetxml = $(this);
            $.getJSON("http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%3D%22"
                   +encodeURIComponent(var_url)+"%22&format=xml'&callback=?",function(data){
                if(data.results[0]){
                    var data = data.results[0];
                    obj_divcnetxml.html($( $.parseXML( data ) ).find( "ul" ).xml());
                };
                obj_divcnetxml.removeClass('hide');
                $("div#cnet_DigitalContentProductDescription li").each(function() {
                       $(this).html("<strong>" + $(this).html() + "</strong><br />" + $(this).next("li").html());
                       $(this).next("li").remove();
                })
            })
        })
    });
-->
</script>
<div class="cnetxml hide" data="http://cdn.cnetcontent.com/30/7f/307f280c-15f2-4e3e-9391-4e09c9ecc450.xml" id="cnet_DigitalContentProductDescription"> </div>

【讨论】：

你的版本比我的更简单、更干净......必须抓住这一点：D 大拇指：）

【解决方案2】：

$(function(){
        $('ul li:nth-child(odd)').contents().filter(function() { return this.nodeType == 3; }).after('<br/>');
        $('ul li:nth-child(odd)').contents().filter(function() {
          return this.nodeType == 3;
        }).wrap('<strong></strong>')
$('ul li:nth-child(odd)').each(function(){
   $(this).append($(this).next().text())
})
$('ul li:nth-child(even)').remove()
})

【讨论】：