javascript：未捕获的类型错误：无法设置 null 的属性“已禁用”

Question

我想知道为什么我的脚本没有取 id 值吗？

我在由 test.js 命名的单个文件中的单独文件夹中使用了这段代码，这是我的起始代码。

 var myInput = document.getElementById("newPass");
var confInput = document.getElementById("confpsw");
var letter = document.getElementById("letter");
var capital = document.getElementById("capital");
var number = document.getElementById("number");
var length = document.getElementById("length");
var special = document.getElementById("special");
document.getElementById("Button").disabled = true;

我的视图代码是..

 <button id="Button" class="btn btn-lg btn-primary btn-block btn-signin" type="submit">Submit</button>

我得到这样的错误…

未捕获的 TypeError：无法设置 null 的属性“已禁用”

为什么我的脚本在 cshtml 中不起作用？

原文由 Sridhar kumar 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

看起来代码在 DOM 准备好之前就已经运行了。试试 DOMContentLoaded 。

DOMContentLoaded 事件在初始 HTML 文档已完全加载和解析时触发，无需等待样式表、图像和子框架完成加载。

 document.addEventListener("DOMContentLoaded", function(event) {
  document.getElementById("Button").disabled = true;
});

原文由 Mamun 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

它与 cshtml 无关。

如果您将用于获取 Dom 元素的行放在标头中，则它不会工作，因为 DOM 尚未加载。

要么将 javascript 放在主体（脚本或代码）的末尾，要么在浏览器加载 DOM 后使用 DOMEvent 运行 JS。

在 JS 中：https: //developer.mozilla.org/fr/docs/Web/Events/load

在 JQuery 中：https: //api.jquery.com/ready/

原文由 Zysce 发布，翻译遵循 CC BY-SA 4.0 许可协议