4 Replies - 3580 Views - Last Post: 21 September 2012 - 10:52 AM

#1 commandz  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 4
  • Joined: 20-September 12

Get image url from media:content url attribute

Posted 20 September 2012 - 02:09 PM

I am trying to retrieve the images (along with other content) from media:content for each post in a RSS feed (as well as others): http://bits.blogs.nytimes.com/feed/

I have tried several variations and I am ending up with
<img src="undefined" alt="image">


This is what the log is saying
 TypeError: 'undefined' is not an object (evaluating '$item.find('media\\:content').attr('url').text')


Here is an example of the XML from the RSS feed (I am trying to grab what is in url="this value")

 <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> 


I tried this link (along with many others) how to get element attribute but I am still getting errors.

There is a PHP file as well (see at bottom) but I don't think that it is the source of the issue.

Here is the HTML with jQuery embedded (originally pulled from https://forum.jquery...ges-27-8-2010).

Thank you for all ideas, pointers, and Suggestions. It is probably something embarrassingly easy.

<!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() {
		
	// Using CNN's RSS Feed as an example
	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>



Here is the associated 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();


?>



Is This A Good Question/Topic? 0
  • +

Replies To: Get image url from media:content url attribute

#2 Dormilich  Icon User is offline

  • 痛覚残留
  • member icon

Reputation: 3576
  • View blog
  • Posts: 10,440
  • Joined: 08-June 10

Re: Get image url from media:content url attribute

Posted 21 September 2012 - 02:14 AM

AFAIK, jQuery is not namespace-aware since even JS uses different accessor methods for elements within a (different) namespace and jQuery is a library optimised for HTML (not XML in general).
Was This Post Helpful? 0
  • +
  • -

#3 commandz  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 4
  • Joined: 20-September 12

Re: Get image url from media:content url attribute

Posted 21 September 2012 - 07:06 AM

Everything works except for the parsing of
Media:Content
. So is jQuery not able to get attributes in XML?
Was This Post Helpful? 0
  • +
  • -

#4 commandz  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 4
  • Joined: 20-September 12

Re: Get image url from media:content url attribute

Posted 21 September 2012 - 07:53 AM

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


Should be this:

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


That does work.

Andy
Was This Post Helpful? 0
  • +
  • -

#5 commandz  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 4
  • Joined: 20-September 12

Re: Get image url from media:content url attribute

Posted 21 September 2012 - 10:52 AM

I made a few changes/additions.

I changed:


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


To:

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


I added (to limit to three feed items):

if (index >= 3) { return false }


And I added (if there was no image defined set to blank image):

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



Everything works great...at least so far :)
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1