Saturday, 28 February 2015

Parsing links from an XML files with JavaScript



To display my latest blog-posts on a different page I want to parse the rss-feed from the blog and then generate elements with it.


I first tried to parse a fixed .xml file for which I wrote the following code:



var maxBlogposts = 5;
var blogPosts = 0;
$.get("rss.xml", function(data) {
$(data).find("item").each(function() {
if(blogPosts === maxBlogposts) return;
var el = $(this);

//Only display 3 posts on small devices.
var extra = (blogPosts >= 3) ? "not-small 12u(small)" : "12u(small)";
var div = $('<div class="6u ' + extra + '" class="blog-entry"></div>');
var h = $('<h4><a href="' + el.find("link").text() + '">' + el.find("title").text() + '</a></h4>');
var description = el.find("description").text().replace('[&#8230;]', '<a href="' + el.find("link").text() + '">[&#8230;]</a>');
var p = $('<p>' + description + '</p>');
div.append(h);
div.append(p);
$('#blog').append(div);
blogPosts++;

});
});


This worked perfectly fine. Now I want to parse the actual rss-feed. For this I wrote a PHP script which simply gets the feed and echos it.



<?php

$rss = file_get_contents('http://ift.tt/1zpKETL');
die($rss);

?>


And again I get the correct XML file on the frontend.


The problem I have is that now my code is no longer working. Getting the description was failing as well as the links. I fixed the description by accessing



el.find(description")[0].innerHTML


However I can't seem to get the links to work. The data returned from the PHP file contains a node with the link in it. The "el"-element also contains children named "link" but those no longer contain the actual link.


I feel like the links may get "escaped" during parsing? At least that is the only reason i could think of that would result in what I am observing.


No comments:

Post a Comment