我收到以下错误
未捕获的TypeError:无法读取null的属性'appendChild'
myRequest.onreadystatechange @ script.js:20
用我的以下代码
// index.html
<html>
<head>
<title>Simple Page</title>
</head>
<body>
<div id="mainContent">
<h1>This is an AJAX Example</h1>
</div>
<script type="text/javascript" src="script.js"></script>
</body>
</html>
这是我的JavaScript文件
// script.js
// 1. Create the request
var myRequest;
// feature check!
if(window.XMLHttpRequest) { // Firefox, Safari
myRequest = new XMLHttpRequest();
} else if (window.ActiveXObject){ // IE
myRequest = new ActiveXObject("Microsoft.XMLHTTP");
}
// 2. Create an event handler for our request to call back
myRequest.onreadystatechange = function() {
console.log("We were called!");
console.log(myRequest.readyState);
if(myRequest.readyState === 4){
var p = document.createElement("p");
var t = document.createTextNode(myRequest.responseText);
p.appendChild(t);
document.getElementById("mainContent").appendChild(p);
}
};
// 3. open and send it
myRequest.open("GET","simple.txt", true);
// any parameters?
myRequest.send(null);
这是内容 simple.txt
这是一个简单文本文件的内容.
我按照@Tejs的建议把脚本标签放在html的底部,但我仍然遇到这个错误.
小智 27
对于有相同问题querySelector或getElementById返回以下错误的人：
Uncaught TypeError: Cannot read property 'appendChild' of null
但是你在 HTML 中有一个类名或 id ......
如果您的脚本标记在头部，则 JavaScript 将在您的 HTML 之前加载。您需要defer像这样添加到脚本中：
<script src="script.js" defer></script>
Ale*_*lan 14
在执行回调时,页面上没有一个带有"mainContent"的元素.
在线:
document.getElementById("mainContent").appendChild(p);
该部分document.getElementById("mainContent")正在返回null
不错的答案在这里。我遇到了同样的问题，但我尝试过，<script src="script.js" defer></script>但效果不佳。我的所有代码和链接都设置得很好。问题是我把js文件链接放在了页面的头部，所以它是在加载DOM之前加载的。对此有 2 种解决方案。
Run Code Online (Sandbox Code Playgroud)window.onload = () => { //write your code here }
<script src="script.js"></script>到 html 文件的底部，以便它最后加载。那些获取 querySelector 或 getElementById 返回以下错误的：
Uncaught TypeError: Cannot read property 'appendChild' of null
或任何其他属性，即使您在 HTML 中有类名或 id
不要使用（推迟，因为它太依赖浏览器了。）
<script src="script.js" defer></script> //don't use this
相反，将所有代码放入“script.js”内
$(document).ready(function(){
//your script here.
}
| 归档时间： |
|
| 查看次数： |
70235 次 |
| 最近记录： |