今天在学习js的过程中想要用最基本的js代码实现背景颜色的改变，但发现有报错
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
document.getElementById("btn").onclick = function () {
document.getElementById("div").style.backgroundColor="yellow"
}
</script>
<style>
div{
width: 180px;
height: 200px;
background-color: red;
}
</style>
</head>
<body>
<div id="div"></div>
<input type="submit" value="change" id="btn">
</body>
</html>
上网查询后得知要将js代码放置input标签后
这是因为浏览器是自上而下解析代码的，如果先解析js代码此时dom树还未建立完全，当然获取不到onclick绑定的input节点，所以会报错
解决办法一：
将该js代码放置input之后
解决办法二：
使用window.onload函数
(借鉴文章 https://blog.csdn.net/jfwzy109127/article/details/83269566）
window.onload函数是等整个页面从下至下加载完毕后才会执行的函数
此时dom树已经完全建立
扫一扫
1097
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
