Error In Safari/ie Error X[i].getelementsbytagname("image")[1] Is Undefined

October 30, 2024 Post a Comment

I am trying to display an RSS feed in HTML. It works on iPad, iPhone and chrome but not in internet explorer or safari. I get an error message saying x[i].getElementsByTagName('ima

Solution 1:

This will give a result. DEMO

Notice I access the entry elements and in the entries I access the im:image tags

UPDATE This works in IE8, Fx Safari and Chrome on XP

<html><head><title>RSS Apps</title><metahttp-equiv="Content-Type"content="text/html; charset=UTF-8"><scripttype="text/javascript">var isIE = navigator.userAgent.indexOf('MSIE')!=-1;
var ns = {im:"http://itunes.apple.com/rss"}; // could be extracted from the root element's attributesfunctiongetElems(obj,tagName) {
  if (!obj.getElementsByTagNameNS) return obj.getElementsByTagName(tagName);

  var prefix = "";
  if (tagName.indexOf(":") !=-1) {
    var parts = tagName.split(":")
    prefix = parts[0];
    tagName = parts[1];    
  }

  if (prefix == "") return obj.getElementsByTagName(tagName); 

  return obj.getElementsByTagNameNS(ns[prefix], tagName);
}
window.onload=function() {
  var xmlhttp;
  if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=newXMLHttpRequest();
  }
  else   {// code for IE6, IE5
    xmlhttp=newActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.open("GET","http://itunes.apple.com/au/rss/topfreeapplications/limit=10/xml?partnerId=1002&partnerUrl=http%3A%2F%2Fwww.s2d6.com%2Fx%2F%3Fx%3Dc%26z%3Ds%26v%3D3868801%26t%3D",false);
  xmlhttp.send();
  xmlDoc=xmlhttp.responseXML; 
  var x=xmlDoc.getElementsByTagName("entry");
  var html = "";
  for (var i=0;i<x.length;i++) {
    var entry = x[i];
    var id =getElems(entry,"id")[0].textContent;
    var nameTag = getElems(entry,"im:name");
    var name = isIE?nameTag[0].text:nameTag[0].textContent;
    html += '<a href="'+id+'">'+name+'<br/>';
    var images = getElems(entry,'im:image');
    for (var j=0;j<images.length;j++) {
      html += '<img src="'+(isIE?images[j].text:images[j].textContent)+'"/>';
    }
    html+='</a><hr/>';
  }
  document.getElementById('content').innerHTML=html;
}  
</script></head><bodybgcolor="#FFFFFF"leftmargin="0"topmargin="0"marginwidth="0"marginheight="0"><divid="content"></div></div></body></html>

UPDATE 2

jQuery version DEMO

$(document).ready(function() {
  jQuery.support.cors = true; // IMPERATIVE for IE(8) support
  $.ajax({
    type: "GET",
    url: "http://itunes.apple.com/au/rss/topfreeapplications/limit=10/xml?partnerId=1002&partnerUrl=http%3A%2F%2Fwww.s2d6.com%2Fx%2F%3Fx%3Dc%26z%3Ds%26v%3D3868801%26t%3D",
    dataType: "xml",
    success: function(xml) {
      $(xml).find('entry').each(function(){
        var id = $(this).find("id").text();
        var title = $(this).find("title").text();
        $("#content").append('<hr/>'+title+'<br/>'); 
        var images = $(this).find("image");
        if (images.length ==0) images = $(this).find("im\\:image");
        $.each(images,function(){
          $("#content").append('<a href="'+id+'"><img src="'+$(this).text()+'"/></a>');
        });
      });
    }
  });
});

Solution 2:

There are definitely some issues with the foundation of your code. For instance, if you were to not hard-code in the index number of the image, such as:

x[i].getElementsByTagName("id")[2]

But instead actually confirmed they existed, that would avoid the error outright.

If I had to guess (and I do) regarding the issue with your specific error, I would assume it's because the image elements have im: namespace prefixes, and that perhaps the browsers throwing errors aren't recognizing the getElementByTagName as the tagname after the namespace.

This is, of course, only a guess. I would recommend using nested loops for each item you are trying to output, as this will isolate the problem, prevent fatal errors, and be easier to maintain and expand later.

Edit:

Does the following work:

var xmlhttp;
           if (window.XMLHttpRequest)
              {// code for IE7+, Firefox, Chrome, Opera, Safari
                  xmlhttp=newXMLHttpRequest();
              }
           else
              {// code for IE6, IE5
                  xmlhttp=newActiveXObject("Microsoft.XMLHTTP");
               }
        xmlhttp.open("GET","http://itunes.apple.com/au/rss/topfreeapplications/limit=10/xml?partnerId=1002&partnerUrl=http%3A%2F%2Fwww.s2d6.com%2Fx%2F%3Fx%3Dc%26z%3Ds%26v%3D3868801%26t%3D",false);
        xmlhttp.send();

var feed = xmlhttp.responseXML; 
var entries = feed.getElementsByTagName("entry");
for (i = 0; i < entries.length; i++) 
    {

    entry_id = entries[i].getElementsByTagName("id")[0];
    entry_image = entries[i].getElementsByTagName("image")[0];
    entry_name = entries[i].getElementsByTagName("name")[0];
    entry_item = document.createElement("li");
        
    entry_figure = document.createElement("figure");
    entry_figure_img = document.createElement("img");
    entry_figure_img.setAttribute("src", entry_image.firstChild.nodeValue);
    entry_image_figcap = document.createElement("figcaption");
    entry_figure.appendChild(entry_figure_img);
 
    entry_link = document.createElement("a");
    entry_link.setAttribute("href", entry_id);
    entry_link_name = document.createTextNode(entry_name.firstChild.nodeValue );
    entry_link.appendChild(entry_link_name);
    entry_image_figcap.appendChild(entry_link);
    entry_figure.appendChild(entry_image_figcap);
    entry_item.appendChild(entry_figure);
    document.body.appendChild(entry_item);
}

JavaScript Controls

Error In Safari/ie Error X[i].getelementsbytagname("image")[1] Is Undefined

Solution 1:

Solution 2:

Edit:

Post a Comment for "Error In Safari/ie Error X[i].getelementsbytagname("image")[1] Is Undefined"