时间戳

首页 > 解决方案 > 无法将输入附加到 DOM

javascript - 无法将输入附加到 DOM

问题描述

我必须只使用 JS，而不是 HTML 来构建一个计算器。我正在为数字创建基本输入字段，但我似乎无法将它们附加到 DOM。我收到以下错误：

> Uncaught TypeError: Cannot read property 'append' of null.

这是我的代码：

var firstInput = document.createElement('input');
firstInput.setAttribute("type", "text");
firstInput.innerHTML = "";
document.body.append(firstInput);

澄清：有一个 HTML 文件，我正在处理一个链接到 HTML 的外部 Javascript 文件。但是，他们不允许我从 HTML 创建元素并使用 Javascript 获取它们。我只能使用 JS 创建元素。

我究竟做错了什么？

标签： javascriptdominput

解决方案

当你的代码被执行时，body 不一定会被加载。在以任何方式使用它之前等待 DOM 准备好是一个很好的做法。

您的脚本应该放在 HTML 正文的最后。

(function() {
  // The DOM will be available here
  var firstInput = document.createElement('input');
  firstInput.setAttribute("type", "text");
  firstInput.innerHTML = "";
  document.body.append(firstInput);
})();

该答案为您提供了有关其工作原理的更多详细信息。

推荐阅读