Reading XML photofeed DOM

@consideroptionsMar 11.2007

I am writing a script that reads a photofeed from Flickr. I’m having trouble extracting information from certain tags.

For example, this XML and JS works:

[CODE]<title>alium hands!</title>[/CODE]
[CODE]itemTitle = getElementsByTagName(‘title’)[0].firstChild.nodeValue; document.write(itemTitle);[/CODE]

But this does not:

[CODE]<media:title>alium hands!</media:title>[/CODE]
[CODE]itemMediaTitle = getElementsByTagName(‘media:title’)[0].firstChild.nodeValue; document.write(itemMediaTitle);[/CODE]

I know that it thinks the tag is a prefix and local name, but I don’t know what code will make it work. Any suggestions?

to post a comment

JavaScript

7 Comments(s) _↴

@Orc_ScorcherMar 11.2007 — #Which browser(s) are you coding for? If not IE, then getElementsByTagNameNS is the method you're looking for.

var media = "whatever_namespace_uri_is_assigned_to_the_media_prefix"
 var titles = theDocument.getElementsByTagNameNS(media, "title")

Or, if there are no other elements with the local name 'title', the slightly cheating shortcut var titles = theDocument.getElementsByTagNameNS("*", "title")

@consideroptionsauthorMar 11.2007 — #Thanks for your help! That seems to work, but leaves me with 2 more questions:

1. How do I get it to work with IE?

I know Apple has an example with a workaround here (near the bottom). I'll give that a try. But are there any strategies to make it work?

2. I'm having trouble reading the information. Going off your example:

[CODE]var titles = theDocument.getElementsByTagNameNS(media, "title")
 var title = titles[0].nodeValue;[/CODE]

title returns null. Am I missing something here?

@UltimaterMar 12.2007 — #This gets Firefox to act like IE.

<i>
 </i>(function(){
 try{
 var t=XMLDocument.prototype.getElementsByTagName;
 XMLDocument.prototype.getElementsByTagName=function (s){
 var a=new String(s).split(":");
 if(a.length&gt;2)return null;//Reject "double" name spaces.
 if(a.length==1)return t.apply(this,[s]);
 var r=t.apply(this,["*"]),l=r.length;
 var p=new Array();
 for(var i=0;i&lt;l;i++){
 if(r[i].prefix==a[0] &amp;&amp; r[i].localName==a[1])p[p.length]=r[i];
 }
 return p;
 }
 
 }catch(e){};
 })()

Then use

<i>
 </i>itemMediaTitle = xmldoc.getElementsByTagName('media:title')[0].firstChild.nodeValue
 document.write(itemMediaTitle);

@UltimaterMar 12.2007 — #Bah... stupid forum 10 minute editing limit.

<i>
 </i>(function(){
 
 try{
 var t=XMLDocument.prototype.getElementsByTagName;
 XMLDocument.prototype.getElementsByTagName=function(s){
 var a=new String(s).split(":");
 if(a.length&gt;2)return null;//Reject "double" name spaces.
 if(a.length==1)return t.apply(this,[s]);
 var r=t.apply(this,["*"]),l=r.length;
 var p=new Array();
 for(var i=0;i&lt;l;i++){
 if(r[i].prefix==a[0] &amp;&amp; r[i].localName==a[1])p[p.length]=r[i];
 }
 return p;
 }
 }catch(e){};
 
 try{
 var t=Element.prototype.getElementsByTagName;
 Element.prototype.getElementsByTagName=function(s){
 var a=new String(s).split(":");
 if(a.length&gt;2)return null;//Reject "double" name spaces.
 if(a.length==1)return t.apply(this,[s]);
 var r=t.apply(this,["*"]),l=r.length;
 var p=new Array();
 for(var i=0;i&lt;l;i++){
 if(r[i].prefix==a[0] &amp;&amp; r[i].localName==a[1])p[p.length]=r[i];
 }
 return p;
 }
 }catch(e){};
 })()

@UltimaterMar 12.2007 — #Opps forgot to rename the variable "t" in the 2nd function so the original isn't overridden.

<i>
 </i>(function(){
 
 try{
 var t=XMLDocument.prototype.getElementsByTagName;
 XMLDocument.prototype.getElementsByTagName=function(s){
 var a=new String(s).split(":");
 if(a.length&gt;2)return null;//Reject "double" name spaces.
 if(a.length==1)return t.apply(this,[s]);
 var r=t.apply(this,["*"]),l=r.length;
 var p=new Array();
 for(var i=0;i&lt;l;i++){
 if(r[i].prefix==a[0] &amp;&amp; r[i].localName==a[1])p[p.length]=r[i];
 }
 return p;
 }
 }catch(e){};
 
 try{
 var t2=Element.prototype.getElementsByTagName;
 Element.prototype.getElementsByTagName=function(s){
 var a=new String(s).split(":");
 if(a.length&gt;2)return null;//Reject "double" name spaces.
 if(a.length==1)return t2.apply(this,[s]);
 var r=t2.apply(this,["*"]),l=r.length;
 var p=new Array();
 for(var i=0;i&lt;l;i++){
 if(r[i].prefix==a[0] &amp;&amp; r[i].localName==a[1])p[p.length]=r[i];
 }
 return p;
 }
 }catch(e){};
 })()

@consideroptionsauthorMar 12.2007 — #Haven't tried it in IE, but on my Mac it works like a charm. Thanks for your help!

@Hysteria86Mar 02.2008 — #Hi,

I've an almost identical problem to this, only with YouTube as opposed to FlickR. Basically, I'm trying to retrieve the <media:title>, <media:keywords> and <media:player url> node values, I can get the values for nodes such as <title>, <name> etc fine, just seem to have a problem with namespaces.

The XML I'm reading from...

<i>
 </i>
 &lt;?xml version="1.0" encoding="UTF-8" ?&gt; 
 - &lt;feed xmlns="http://www.w3.org/2005/Atom" xmlns:openSearch="http://a9.com/-/spec/opensearchrss/1.0/" xmlns:gml="http://www.opengis.net/gml" xmlns:georss="http://www.georss.org/georss" xmlns:media="http://search.yahoo.com/mrss/" xmlns:yt="http://gdata.youtube.com/schemas/2007" xmlns:gd="http://schemas.google.com/g/2005"&gt;
 &lt;id&gt;http://gdata.youtube.com/feeds/api/users/Hysteria862/uploads?start-index=1&amp;max-results=25&lt;/id&gt; 
 &lt;updated&gt;2008-02-28T20:27:15.746Z&lt;/updated&gt; 
 &lt;category scheme="http://schemas.google.com/g/2005#kind" term="http://gdata.youtube.com/schemas/2007#video" /&gt; 
 &lt;title type="text"&gt;Hysteria862's Videos&lt;/title&gt; 
 &lt;logo&gt;http://www.youtube.com/img/pic_youtubelogo_123x63.gif&lt;/logo&gt; 
 &lt;link rel="related" type="application/atom+xml" href="http://gdata.youtube.com/feeds/api/users/hysteria862" /&gt; 
 &lt;link rel="alternate" type="text/html" href="http://www.youtube.com/profile_videos?user=hysteria862" /&gt; 
 &lt;link rel="http://schemas.google.com/g/2005#feed" type="application/atom+xml" href="http://gdata.youtube.com/feeds/api/users/Hysteria862/uploads" /&gt; 
 &lt;link rel="self" type="application/atom+xml" href="http://gdata.youtube.com/feeds/api/users/Hysteria862/uploads?start-index=1&amp;max-results=25" /&gt; 
 - &lt;author&gt;
 &lt;name&gt;hysteria862&lt;/name&gt; 
 &lt;uri&gt;http://gdata.youtube.com/feeds/api/users/hysteria862&lt;/uri&gt; 
 &lt;/author&gt;
 &lt;generator version="beta" uri="http://gdata.youtube.com/"&gt;YouTube data API&lt;/generator&gt; 
 &lt;openSearch:totalResults&gt;13&lt;/openSearch:totalResults&gt; 
 &lt;openSearch:startIndex&gt;1&lt;/openSearch:startIndex&gt; 
 &lt;openSearch:itemsPerPage&gt;25&lt;/openSearch:itemsPerPage&gt; 
 - &lt;entry&gt;
 &lt;id&gt;http://gdata.youtube.com/feeds/api/videos/cxnKR7Tl0aI&lt;/id&gt; 
 &lt;published&gt;2006-10-03T03:28:35.000-07:00&lt;/published&gt; 
 &lt;updated&gt;2008-01-18T09:07:54.000-08:00&lt;/updated&gt; 
 &lt;category scheme="http://gdata.youtube.com/schemas/2007/categories.cat" term="People" label="People &amp; Blogs" /&gt; 
 &lt;category scheme="http://schemas.google.com/g/2005#kind" term="http://gdata.youtube.com/schemas/2007#video" /&gt; 
 &lt;category scheme="http://gdata.youtube.com/schemas/2007/keywords.cat" term="Nathan" /&gt; 
 &lt;category scheme="http://gdata.youtube.com/schemas/2007/keywords.cat" term="wet" /&gt; 
 &lt;title type="text"&gt;Nathan gets wet&lt;/title&gt; 
 &lt;content type="text"&gt;Nathan's silly faces at the camera come to an abrupt end when Mat soaks him with water.&lt;/content&gt; 
 &lt;link rel="alternate" type="text/html" href="http://www.youtube.com/watch?v=cxnKR7Tl0aI" /&gt; 
 &lt;link rel="http://gdata.youtube.com/schemas/2007#video.responses" type="application/atom+xml" href="http://gdata.youtube.com/feeds/api/videos/cxnKR7Tl0aI/responses" /&gt; 
 &lt;link rel="http://gdata.youtube.com/schemas/2007#video.related" type="application/atom+xml" href="http://gdata.youtube.com/feeds/api/videos/cxnKR7Tl0aI/related" /&gt; 
 &lt;link rel="self" type="application/atom+xml" href="http://gdata.youtube.com/feeds/api/users/hysteria862/uploads/cxnKR7Tl0aI" /&gt; 
 - &lt;author&gt;
 &lt;name&gt;Hysteria862&lt;/name&gt; 
 &lt;uri&gt;http://gdata.youtube.com/feeds/api/users/hysteria862&lt;/uri&gt; 
 &lt;/author&gt;
 - &lt;media:group&gt;
 [color=red] &lt;media:title type="plain"&gt;Nathan gets wet&lt;/media:title&gt; [/color]
 &lt;media:description type="plain"&gt;Nathan's silly faces at the camera come to an abrupt end when Mat soaks him with water.&lt;/media:description&gt; 
 [color=red] &lt;media:keywords&gt;Nathan, wet&lt;/media:keywords&gt; [/color]
 &lt;yt:duration seconds="12" /&gt; 
 &lt;media:category label="People &amp; Blogs" scheme="http://gdata.youtube.com/schemas/2007/categories.cat"&gt;People&lt;/media:category&gt; 
 &lt;media:content url="http://www.youtube.com/v/cxnKR7Tl0aI" type="application/x-shockwave-flash" medium="video" isDefault="true" expression="full" duration="12" yt:format="5" /&gt; 
 &lt;media:content url="rtsp://rtsp2.youtube.com/ChoLENy73wIaEQmi0eW0R8oZcxMYDSANFEgGDA==/0/0/0/video.3gp" type="video/3gpp" medium="video" expression="full" duration="12" yt:format="1" /&gt; 
 &lt;media:content url="rtsp://rtsp2.youtube.com/ChoLENy73wIaEQmi0eW0R8oZcxMYESARFEgGDA==/0/0/0/video.3gp" type="video/3gpp" medium="video" expression="full" duration="12" yt:format="6" /&gt; 
 [color=red]  &lt;media:player url="http://www.youtube.com/watch?v=cxnKR7Tl0aI" /&gt; [/color]
 &lt;media:thumbnail url="http://img.youtube.com/vi/cxnKR7Tl0aI/2.jpg" height="97" width="130" time="00:00:06" /&gt; 
 &lt;media:thumbnail url="http://img.youtube.com/vi/cxnKR7Tl0aI/1.jpg" height="97" width="130" time="00:00:03" /&gt; 
 &lt;media:thumbnail url="http://img.youtube.com/vi/cxnKR7Tl0aI/3.jpg" height="97" width="130" time="00:00:09" /&gt; 
 &lt;media:thumbnail url="http://img.youtube.com/vi/cxnKR7Tl0aI/0.jpg" height="240" width="320" time="00:00:06" /&gt; 
 &lt;/media:group&gt;
 &lt;yt:statistics viewCount="201" /&gt; 
 - &lt;gd:comments&gt;
 &lt;gd:feedLink href="http://gdata.youtube.com/feeds/api/videos/cxnKR7Tl0aI/comments" countHint="0" /&gt; 
 &lt;/gd:comments&gt;
 &lt;/entry&gt;

And the JavaScript..

<i>
 </i>var doc = http.responseXML;
 var media = ="http://search.yahoo.com/mrss/";
 var player = doc.getElementsByTagNameNS(media, "player")[0].getAttribute("url");
 var title = doc.getElementsByTagNameNS(media, "title")[0].firstChild.nodeValue;
 
 var keywords = doc.getElementsByTagNameNS(media,"keywords")[0].firstChild.nodeValue; 
 alert(keywords);

Does anyone have any ideas? I can't really see how this example is any different to the previous one, but it simply doesn't work.

Thanks.

Also in #JavaScript _↴

IE7 crashes when adding an iframe Javascript in Linux???learning Javascript question...

Success!

Help @consideroptions spread the word by sharing this article on Twitter...

Tweet This

Reading XML photofeed DOM

7 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

Reading XML photofeed DOM

7 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

7 Comments(s) _↴

Also in #JavaScript _↴