javascript位置错误导致Uncaught TypeError: Cannot read property 'elements' of null

最新推荐文章于 2025-06-06 14:49:48 发布

hylbk

最新推荐文章于 2025-06-06 14:49:48 发布

阅读量1.4w

点赞数 5

CC 4.0 BY-SA版权

分类专栏： JavaScript 文章标签： JavaScript

本文链接：https://blog.youkuaiyun.com/hylbk/article/details/79122860

JavaScript 专栏收录该内容

3 篇文章

订阅专栏

本文介绍了一种在JavaScript中获取HTML表单字段的方法，并通过一个具体的实例演示了如何避免因脚本执行时机不当导致的错误。通过调整JS代码的位置到body标签末尾，可以确保DOM完全加载后再执行JS代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在学习js的表单脚本的时候，写了一个取表单字段的demo：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        var form=document.getElementById("myForm");
        var field=form.elements[0];
        alert(field);
    </script>
</head>
<body>
<form method="post" id="myForm">
    <ul>
        <li><input type="radio" name="color" value="red">Red</li>
        <li><input type="radio" name="color" value="green">Green</li>
        <li><input type="radio" name="color" value="blue">Blue</li>
    </ul>
</form>
</body>
</html>

发现浏览器报错如下：Uncaught TypeError: Cannot read property 'elements' of null，发现原来是js代码的位置放错了，JS运行的时候页面还没有加载完成，所以JS代码找不到页面元素，就会抛出这个问题。将js代码放在body最后就ok了。