从JQuery中的单个var中提取部分信息

时间:2013-07-02 20:45:53

标签: xml jquery xhtml

我正在使用jquery来引入XML提要。问题是所有信息都在一个节点下:

    <description><![CDATA[<div class="element element-date first">
    Friday, 09 August 2013</div>
<div class="element element-textarea">
    <p>CES MMA Champion Mike "The Beast" Campbell (13-4, Providence, RI.), Dinis "Sweetbread" Paiva (E. Providence, RI.), Keith "Sonic Boom" Jeffrey (9-2, Pawtucket, RI.) and more!</p></div>
<div class="element element-link last">
    <a href="http://www.ticketmaster.com/ces-mma-presents-live-cagefighting-lincoln-rhode-island-08-09-2013/event/01004ACBB23C9DC4?artistid=1765605&majorcatid=10004&minorcatid=830" title="Click here to buy tickets!" target="_blank" >Click here to buy tickets!</a></div>]]></description>

我可以提取这些信息并让它显示得很好。我需要做的是拉出这个节点的一个非常具体的部分,日期:

<div class="element element-date first">
        Friday, 09 August 2013</div>

我不确定如何获取此信息,因此我将发布我正在处理的jquery代码,看看是否有人可以帮我找出解决方案:

$(document).ready(function () {
    var i = 0;
    var title = [];
    var temp = [];
    var desc = [];
    var $divElements = $('.element element-date first');

    $.ajax({
        type: "GET",
        url: "http://twinriver.com/index.php/entertainment/twin-river-event-center/feed/rss/events/event-center?format=feed",
        dataType: "xml",
        success: function (xml) {
            $(xml).find('item').each(function () {
                title[i] = $(this).find('title').text();
                desc[i] = $(this).find('description').text();
                i++;
                //alert(i);
            });
            //this is where im trying to get it to pull the info i need.
            for (var x = 0; x < i; x++) {
                alert($(desc[x]).find($divElements).val());
            }
            for (var t = 0; t < i; t++) {
                //      
                $('#EventList').append('<span class="title">' + title[t] + '</span>' + '<br />' + '<br />' + '<span>' + desc[t] + '<br />' + '<hr />');
            }
        }
    });
});

更新07/03/2013:

尝试使用回复中提供的解决方案,但没有运气。警报出现两个项目之一,其空白或读取“未定义”。我也尝试过使用以下内容:

eDate[i] = $(this).find('description').find('.element.element-date.first').html();

            alert(eDate[i]);

我在var eDate = [];添加了其余的声明变量

是否会导致问题,即我试图获取的信息未包含在

标记中? 如果是这样的话还有必须添加它们?我不认为我可以真正编辑传入的数据格式,但我也会将其作为一种选择进行研究。

4 个答案:

答案 0 :(得分:1)

$('.element.element-date.first').each(function() {
  $(this).text(); // In each iteration this will get you the date
});

这样你就不需要编写自己的循环了(参见.each() documentation)你遇到的另一个问题是,当你看到class =“class1 class2 class3”时,你会在jQuery中引用它CSS用。在每个类之前(因为在class属性中用空格分隔的值是功能上不同的CSS类)。

答案 1 :(得分:0)

你的选择器应该是这样的 -

var $divElements = $('.element.element-date.first');

答案 2 :(得分:0)

将选择器传递给find而不是jQuery对象

var divSelector = '.element.element-date.first';
...
        for (var x = 0; t <= i; x++) {
            alert($(desc[t]).find(divSelector).text());//try also $.parseHTML(desc[t])
        }

答案 3 :(得分:0)

主要问题在于您感兴趣的内容实际上包含在CDATA部分中,因此您不会在这些节点的dom树中获得层次结构,而只是一个节点代表整个文本在CDATA内部。 此外,由于CDATA内部的内容没有自己的根,因此在传递到jquery时不会评估为xml结构,这一点很复杂。

一个简单的解决方案是从

中包装text()结果

desc[i] = $(this).find('description').text();

像这样:

desc[i] = "<rootnode>" + $(this).find('description').text() + "</rootnode>";

然后警报将在将for循环表达式修复为

后正确显示日期

for (var t = 0; t < i; t++)

并用普通的替换选择器。

var divElements = '.element.element-date.first';

可能还有其他更好的解决方案,但我对此进行了测试并且有效。

更新:感觉代码可以使用一些清洁。没有理由让所有这些阵列都进行一些重组。

$(document).ready(function () {
    $.ajax({
    type: "GET",
    url: "http://twinriver.com/index.php/entertainment/twin-river-event-center/feed/rss/events/event-center?format=feed",
    dataType: "xml",
    success: function (xml) {
      $(xml).find('item').each(function () {
            var title = $(this).find('title').text();
            var desc = "<rootnode>" + $(this).find('description').text() + "</rootnode>";
            var date = $(desc).find('.element.element-date.first').text()
            $('#EventList').append('<span class="title">' + title + '</span>' + '<br />' + '<br />' + '<span>' + date + '<br />' + '<br />');
            });
        }
    });
});