从媒体获取URL:使用jQuery在RSS XML feed中获取内容

时间:2012-09-20 18:52:31

标签: jquery html rss xml-parsing

我正在尝试从media:content中为RSS Feed中的每个帖子检索图像(以及其他内容):http://bits.blogs.nytimes.com/feed/

我尝试过此链接(以及其他许多链接)jQuery XML parsing how to get element attribute 但我仍然遇到错误。

还有一个PHP文件(见下文),但我不认为这是问题。

我尝试了几种变体,最后以<img src="undefined" alt="image">

结束

这就是日志所说的TypeError: 'undefined' is not an object (evaluating '$item.find('media\\:content').attr('url').text')

以下是来自RSS提要的XML示例(我正在尝试抓取url中的内容=“此值”) <media:content url="http://graphics8.nytimes.com/images/2011/11/30/technology/bits-daily-report/bits-daily-report-thumbStandard.jpg" medium="image" width="75" height="75"></media:content>

这是我的jQuery嵌入式HTML。感谢您提供所有解决方案,指示和建议。我现在正在遇到障碍。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title>Your Site Title</title>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

<script type="text/javascript">
$(document).ready(function(){

function get_rss_feed() {

// RSS Feed Var
var rssUrl = 'http://bits.blogs.nytimes.com/feed/';

//clear the content in the div for the next feed.
$("#feedContent").empty();

//use the JQuery get to grab the URL from the selected item, put the results in to an argument for parsing in the inline function called when the feed retrieval is complete
$.get('rss.php?url='+rssUrl, function(d) {

    //find each 'item' in the file and parse it
    $(d).find('item').each(function() {

        //name the current found item this for this particular loop run
        var $item = $(this);
        // grab the post title
        var title = $item.find('title').text();
        // grab the post's URL
        var link = $item.find('link').text();
        // next, the description
        var description = $item.find('description').text();
        //don't forget the pubdate
        var pubDate = $item.find('pubDate').text();
        var media = $item.find('media\\:content').attr('url').text();

            // now create a var 'html' to store the markup we're using to output the feed to the browser window
        var html = "<div class=\"entry\"><h2 class=\"postTitle\">" + title + "<\/h2>";
        html += "<em class=\"date\">" + pubDate + "</em>";
        html += "<p class=\"description\">" + description + "</p>";
        html += "<img src=\"" + media + "\" alt=\"image\"/>";
        html += "<a href=\"" + link + "\" target=\"_blank\">Read More >><\/a><\/div>";

        //Send Results to a div
        $('#rss').append($(html));  
    });
});

};
get_rss_feed();

  });
</script>
</head>

<body>
<h1>RSS TEST</h1>
<!-- Your RSS DIV -->
<div id="rss"></div>

</body>
</html>

这是我的PHP

<?php

  ob_start();

  $curl = curl_init($_GET['url']);

  curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
  curl_setopt($curl, CURLOPT_HEADER, false);

  $xml = curl_exec($curl);  
  header("Content-Type: text/xml");
  echo $xml; // Results

  $output = ob_get_clean();

  curl_close($curl);
  echo $output;

  ob_end_flush();


?>

1 个答案:

答案 0 :(得分:4)

这:

var media = $item.find('media\\:content').attr('url').text();

应该是这样的:

 var media = $item.find('media\\:content, content').attr('url'):

编辑(添加其他更改):

我改变了:

$(d).find('item').each(function() {

致:

$(d).find('item').each(function(index) {

我添加了(限制为三个Feed项目):

if (index >= 3) { return false }

我添加了(如果没有图像定义设置为空白图像):

if (typeof mediatest === 'undefined') { var mediatest = 'blank.png' };

一切都很好......至少到目前为止:)