javascript 未捕获的类型错误：无法设置 null 的属性“innerHTML”
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16115867/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
提示：将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间：2020-10-27 03:20:00 来源:igfitidea点击:
Uncaught TypeError: Cannot set property 'innerHTML' of null
提问by user2299963
I have been having some trouble with this code. I have tried my best to stay with the book but the book seems to be wrong.
我在使用此代码时遇到了一些麻烦。我已尽我最大的努力坚持这本书，但这本书似乎是错误的。
The following code should display the RSS feed for which ever radio button has been selected. You can also see the website on http://w3.cnm.edu/~bnoble/cis1210/afds/Travel/TravelDeals.html.
以下代码应显示选择了哪个单选按钮的 RSS 提要。您也可以在http://w3.cnm.edu/~bnoble/cis1210/afds/Travel/TravelDeals.html上查看该网站。
Thanks in advance for any help!
在此先感谢您的帮助！
<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>
回答by Arun P Johny
There is no element with id rssFeedin the page.
rssFeed页面中没有带有 id 的元素。
You can solve it by adding a divwith id rssFeedin the page
可以通过在页面中添加一个divwith id来解决rssFeed
<div id="rssFeed"></div>
Try this complete code, because you have unclosed element in your markup
试试这个完整的代码，因为你的标记中有未关闭的元素
<html>
<head>
<title>Travel Deals RSS Feed</title>
<script>
var rssRequest = false;
function parseXML(xml){
var parser, xmlDoc;
if (window.DOMParser) {
parser = new DOMParser();
xmlDoc = parser.parseFromString(xml,"text/xml");
} else {
// Internet Explorer
xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.async = false;
xmlDoc.loadXML(xml);
}
}
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 = parseXML(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>
</tr>
</table>
<div id="rssFeed"><div>
</form>
</body>
</html>
回答by legacybass
It's because you're missing a closing quote in your tdelement. You have <td id="rssFeed" valign="top></td>when what you want is <td id="rssFeed" valign="top"></td>. Fixing this should cause the element to show up.
这是因为您在td元素中缺少结束语。你<td id="rssFeed" valign="top></td>当你想要的是<td id="rssFeed" valign="top"></td>。解决这个问题应该会导致元素出现。
