Question

我正在尝试以HTML格式显示RSS源。它适用于iPad，iPhone和Chrome，但不适用于Internet Explorer或Safari。我收到一条错误消息

x[i].getElementsByTagName("image")[1] is undefined

有谁知道如何让这个工作？它使用Apple RSS提要来显示App Store中的应用程序。错误发生在第一个document.write。我也试图在表格中显示返回的结果。

        <html>
<head>
<title>RSS Apps</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<script type="text/javascript">
var xmlhttp;
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("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("feed");
for (i=0;i<x.length;i++)

  { 
  document.write("<a href="+x[i].getElementsByTagName("id")[1].childNodes[0].nodeValue+"><img src=" + x[i].getElementsByTagName("im:image")[1].childNodes[0].nodeValue +"></a>");
  document.write("</td><td>");
  document.write("<a href="+x[i].getElementsByTagName("id")[2].childNodes[0].nodeValue+"><img src=" + x[i].getElementsByTagName("im:image")[4].childNodes[0].nodeValue +"></a>");
  document.write("</td><td>"); 
  document.write("<a href="+x[i].getElementsByTagName("id")[3].childNodes[0].nodeValue+"><img src=" + x[i].getElementsByTagName("im:image")[7].childNodes[0].nodeValue +"></a>");
  document.write("</td></tr><tr><td>");

  document.write("<font size=\"1\"><a href="+x[i].getElementsByTagName("id")[1].childNodes[0].nodeValue+">" + x[i].getElementsByTagName("name")[1].childNodes[0].nodeValue+"</a>");
  document.write("</td><td>");
  document.write("<font size=\"1\"><a href="+x[i].getElementsByTagName("id")[1].childNodes[0].nodeValue+">" + x[i].getElementsByTagName("name")[2].childNodes[0].nodeValue+"</a>");
  document.write("</td><td>");
  document.write("<font size=\"1\"><a href="+x[i].getElementsByTagName("id")[1].childNodes[0].nodeValue+">" + x[i].getElementsByTagName("name")[3].childNodes[0].nodeValue+"</a>");
  }
</script>
</td></tr>
</table>
</div>
</body>
</html>

更新了处理“im：image”的代码，现在代码可以在Internet Explorer和Safari中使用，但不能在chrome中使用。

Answer 1

这将给出结果。 DEMO

注意我访问entry元素，并在条目中访问im：image标记

更新适用于IE8，Fx Safari和Chrome上的Chrome

<html>
<head>
<title>RSS Apps</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<script type="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 attributes

function getElems(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=new XMLHttpRequest();
  }
  else   {// code for IE6, IE5
    xmlhttp=new ActiveXObject("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>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div id="content"></div>
</div>
</body>
</html>

更新2

jQuery版本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>');
        });
      });
    }
  });
});

Answer 2

您的代码基础肯定存在一些问题。例如，如果您不对图像的索引号进行硬编码，例如：

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

但实际证实他们存在，这将彻底避免错误。

如果我不得不猜测（和我这样做）有关您的特定错误的问题，我会假设它是因为image元素具有im:名称空间前缀，并且可能是抛出错误的浏览器不会将getElementByTagName识别为命名空间后的标记名。

这当然只是猜测。我建议对您尝试输出的每个项目使用嵌套循环，因为这样可以隔离问题，防止致命错误，并且以后更容易维护和扩展。

编辑：

以下是否有效：

var xmlhttp;
           if (window.XMLHttpRequest)
              {// code for IE7+, Firefox, Chrome, Opera, Safari
                  xmlhttp=new XMLHttpRequest();
              }
           else
              {// code for IE6, IE5
                  xmlhttp=new ActiveXObject("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);
}

safari / IE错误中的错误x [i] .getElementsByTagName（“image”）[1]未定义

2 个答案:

编辑：