尝试从文本输入向数组添加元素时遇Uncaught TypeError错误求助

错误核心原因 #

你遇到的Uncaught TypeError: document.getElementId is not a function是函数名拼写错误导致的——DOM标准获取元素的方法是document.getElementById()（注意是ById，字母B为大写），你误写为getElementId，少了一个大写的B。

另外还有一个潜在问题：直接获取<input>元素对象并拼接的话，得到的会是[object HTMLInputElement]这类无效字符串，而非输入框内的文本内容，需要通过.value属性获取用户输入的实际内容。

修正后的代码 #

HTML部分（原代码无问题，保持即可）

<p>Quote: <input type="text" id="quoteWords"></p>
<p>Name: <input type="text" id="quoteName"></p>
<button id="submitButton"><strong>Submit</strong></button>

JavaScript部分

// 确保quote数组已提前声明
var quote = [];
var button = document.getElementById("submitButton");
button.addEventListener("click", function() {
  // 修正函数名，并通过.value获取输入内容
  var customQuote1 = document.getElementById("quoteWords").value;
  var customQuote2 = document.getElementById("quoteName").value;
  quote.push(customQuote1 + "<p>- " + customQuote2 + "</p>");
});

额外提示 #

如果quote数组未提前声明，执行时会出现quote is not defined的新错误，所以要确保数组在当前作用域内已初始化（如代码中添加var quote = [];）。

内容的提问来源于stack exchange，提问作者Kaden Lukas