使用对象原型中的文档方法

Using a document method from within object prototype?

本文关键字：文档 方法 原型 对象      更新时间：2023-09-26

我对javascript很陌生，正在尝试使用一个名为"button"的键设置一个名为"number"的原型，该键使用您传递的任何ID来获取HTML元素。HTML 中已经存在一个 ID 为"one"的元素。

我想知道为什么这不起作用？

function number(num, idOfNum) {
 this.val = num;
 this.button = document.getElementById(idOfNum);
};
var one = new number(1, "one");
console.log(one.button); // null?

如果one.button是null，那么这只是因为document.getElementById("one");在运行number()对象的构造函数时没有找到DOM对象，因此null返回。

这可能是因为页面中没有具有该 id 的对象，也可能是因为您在页面完成加载之前运行此代码，因此当您运行代码时该对象尚不存在。

您必须显示更多整体页面上下文（代码与页面 DOM 解析相关的执行位置），以便我们确切地知道这里发生了哪种情况。

对于过早运行代码的情况，一个常见的解决方法是将此代码所在的 <script> 标记移动到 </body> 标记之前。 这将确保在此代码运行时所有 DOM 元素都存在。 有关此问题的更完整解释，请参阅以下答案：纯JavaScript等同于jQuery的$.ready（）如何在page/dom准备就绪时调用函数。

相关文章：