未捕获的TypeError:无法设置null的属性'innerHTML'

时间:2013-04-20 02:21:10

标签: javascript ajax

我在使用此代码时遇到了一些麻烦。我尽力留下这本书,但这本书似乎错了。

以下代码应显示已选择单选按钮的RSS源。您还可以在http://w3.cnm.edu/~bnoble/cis1210/afds/Travel/TravelDeals.html上看到该网站。

提前感谢您的帮助!

<html>
<head>
    <title>Travel Deals RSS Feed</title>
    <script>
        var rssRequest = false;
        function getRequestObject()
        {
            try
            {
                rssRequest = new XMLHttpRequest();
            }
            catch (requestError)
            {
                try
                {
                rssRequest = new ActiveXObject();
                }
                catch (requestError)
                {
                    try
                    {
                        rssRequest = new 
                        ActiveXObject("Micorsoft.XMLHTTP");
                    }
                    catch (requestError)
                    {
                        window.alert("I am sorry. Your browser does not support AJAX. Please upgrade your broweser and try again.");
                        return false;
                    }
                }
            }
            return rssRequest;
        }
        function rssUpdate()
        {
            if(!rssRequest)rssRequest = getRequestObject();
            for (var i=0; i<6; ++i)
            {
                if (document.forms[0].deals[i].checked == true)
                {
                    var rss = document.forms[0].deals[i].value;
                    break;
                }
            }
            rssRequest.abort();
            rssRequest.open("get","TravelDeals.php?" + "rss" + rss, true);
            rssRequest.send(null)
            rssRequest.onreadystatechange=getRssDeals;
            //clearTimeout(recentDeals);
            //var recentDeals = setTimeout('rssUpdate()', 5000);
        }
        function getRssDeals()
        {
            if(rssRequest.readyState==4 && rssRequest.status == 200)
            {
                var deals = rssRequest.responseXML; 
                document.getElementById("rssFeed").innerHTML = ""
                var dealsInfo=deals.getElementsByTagName("item");
                if (dealsInfo.length > 0)
                {
                    for (var i=0; i<dealsInfo.length; ++i) 
                    {
                        var curHeadline = dealsInfo[i].getElementsByTagName("title")[0].childNodes[0].nodeValue;
                        var curlink = dealsInfo[i].getElementsByTagName("link")[0].childNodes[0].nodeValue;
                        var curPubDate = dealsInfo[i].getElementsByTagName("pubDate")[0].childNodes[0].nodeValue;
                        var curDesc = dealsInfo[i].getElementsByTagName("description")[0].childNodes[0].nodeValue;
                        var curDeal = "<a href='" + curLink + "'>" + curHeadline + "</a><br/>";
                        curDeal +=  curDesc + "<br/>";curDeal += curDesc + "<br/>";
                        document.getElementById("rssFeed").innerHTML += curDeal;
                    }
                }
                else
                    document.getElementById("rssFeed").innerHTML = "The RSS feed appears to be broken or empty.";
            }
        }
    </script>
</head>
<body onload="rssUpdate()">
    <h1>Travel Deals RSS</h1>
    <form method="get" action="">
        <table border="1">
            <colgroup span="1" width="125"/>
            <colgroup span="1" width="350"/>
            <tr>
                <td align="top">
                    <input type="radio" name="deals" value="http://www.orbitz.com/rss/topdeals-vacationpackages.rss.xml" onclick="rssUpdate()"/><Orbitz<br/>
                    <input type="radio" name="deals" value="http://www.travelocity.com/dealservice/globaltrips-shopping-svcs/deals-1.0/services/RssDealsServices?ProductType=Air&rdr=GEN&nm=My~Travelocity~Specials&typ=0&orig=ABQ&dest=PHX,LAS,LAX,NYC,LGB&id=9197I1366355523195" checked="checked" onclick="rssUpdate()"/><Travelocity<br/>
                    <input type="radio" name="deals" value="http://press.hotwire.com/index.php?s=43&pagetemplate=rss" onclick="rssUpdate()"/><Hotwire<br/>
                </td>
                <td id="rssFeed" valign="top></td>
            </tr>
        </table>
    </form>
</body>

2 个答案:

答案 0 :(得分:1)

页面中没有标识为rssFeed的元素。

您可以通过在页面

中添加ID为div的{​​{1}}来解决此问题
rssFeed

试试这个完整的代码,因为你的标记中有未闭合的元素

<div id="rssFeed"></div>

答案 1 :(得分:0)

这是因为您错过了td元素中的结束语。当你想要的是<td id="rssFeed" valign="top></td>时,你有<td id="rssFeed" valign="top"></td>。修复此问题会导致元素显示。