html问题
代码：<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>小甲鱼Web开发教程概览</title>
</head>
<body>
<script type="text/javascript" defer>
var urlParams = new URLSearchParams(window.location.search);
var cid = urlParams.get('cid');
document.getElementById('main').innerHTML = "<h1>" + cid + "</h1>";
</script>
<div id="main"> <!--主页面-->
</div>
</body>
</html>
截图：
你的JavaScript代码试图在页面加载时修改 div 元素的 innerHTML ，但是在你的 script 元素中，你并未等待你的HTML元素被完全加载。当JavaScript试图通过 document.getElementById('main') 获取元素时，这个元素可能还没有被浏览器加载完全，所以返回的是 null 。在你试图更改这个 null 的 innerHTML 时，将会出现错误。
你可以把这段JavaScript代码放在 body 的末尾，或者把它放在一个会在所有HTML元素都加载完毕后执行的函数里，比如 window.onload 或 DOMContentLoaded 事件的监听器中。这样可以确保在执行这段JavaScript代码时HTML元素已经被完全加载了。
以下是一个修正后的代码示例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>小甲鱼Web开发教程概览</title>
</head>
<body>
<div id="main"> <!--主页面-->
</div>
<script type="text/javascript">
window.onload = function() {
var urlParams = new URLSearchParams(window.location.search);
var cid = urlParams.get('cid');
document.getElementById('main').innerHTML = "<h1>" + cid + "</h1>";
}
</script>
</body>
</html>
在这个修改后的版本中，JavaScript代码被封装在一个会在页面加载完毕后才执行的函数中。 isdkz 发表于 2023-6-1 15:25
你的JavaScript代码试图在页面加载时修改 div 元素的 innerHTML ，但是在你的 script 元素中，你并未等待你 ...
睡醒了？ 歌者文明清理员 发表于 2023-6-1 15:26
睡醒了？
{:10_284:}本来想睡个半小时起床吃午餐，结果忘记调闹钟就睡到现在了 isdkz 发表于 2023-6-1 15:28
本来想睡个半小时起床吃午餐，结果忘记调闹钟就睡到现在了
嘿嘿~sfqxx不在最佳都是我的！ 歌者文明清理员 发表于 2023-6-1 15:32
嘿嘿~sfqxx不在最佳都是我的！
{:10_327:}
你看嘛，让你几天，到时候再发威{:10_279:}
上个月超过你70 sfqxx 发表于 2023-6-1 16:15
你看嘛，让你几天，到时候再发威
上个月超过你70
切，昨天晚上我蹲点追回来4个 歌者文明清理员 发表于 2023-6-1 16:16
切，昨天晚上我蹲点追回来4个
当夜猫子可不是个好习惯哦~ sfqxx 发表于 2023-6-1 16:16
当夜猫子可不是个好习惯哦~
甲鱼也是夜猫子 歌者文明清理员 发表于 2023-6-1 16:17
甲鱼也是夜猫子
人家是学生党吗？ sfqxx 发表于 2023-6-1 16:18
人家是学生党吗？
又没事 歌者文明清理员 发表于 2023-6-1 16:23
又没事
所以你的成绩……{:10_256:} sfqxx 发表于 2023-6-1 16:24
所以你的成绩……
？我又不会上课睡觉 前端是我最拿手的，js基本精通（划掉），vue也会用
这个东西的话是从上往下执行的，你script再前，div定义在后面，肯定访问不到
解决方法：
1.在js代码的最外面套一个onload:window.onnload=()=>{代码}
2.在div后插入代码
页:
[1]