And*_*son 5 javascript dom onclick
我刚刚开始学习Javascript，几乎什么都不懂。我正在尝试将 onclick 事件附加到 HTML 中的元素。
var joinList = function() {
alert("This should display when clicked");
}
document.getElementById("header").onclick = joinList;
这是我到目前为止的代码。当单击具有 header ID 的元素时，不会发生任何事情。我究竟做错了什么？
以下是我的 HTML 代码
<!DOCTYPE html>
<html>
<head>
<title>Testing Page</title>
<script src="testing.js"></script>
</head>
<body>
<h1 id="header">Andrew Dawson</h1>
</body>
</html>
问题是，您尝试加载一个 html 元素，但在执行 javascript 函数时该元素并不“存在”，因为 dom 尚未完成加载。为了使您的代码正常工作，您可以尝试以下解决方案：
将您的脚本标记放在 HTML 中的下面：
<!DOCTYPE html>
<html>
<head>
<title>Testing Page</title>
</head>
<body>
<h1 id="header">Andrew Dawson</h1>
<script src="testing.js"></script>
</body>
</html>
添加一个事件处理程序来检查窗口元素是否准备好：
window.addEventListener("load", eventWindowLoaded, false);
function eventWindowLoaded(){
var joinList = function() {
alert("This should display when clicked");
}
document.getElementById("header").onclick = joinList;
}
另一种解决方案是使用 jquery 框架和相关的文档就绪函数 http://api.jquery.com/ready/