给出input.value和input.textContent之间的区别。为什么使用一个而不是另一个？

Question

为什么使用input.value而不是input.textContent。两者有什么区别？

例如，如果我想从输入框中检索内容。

<input type="number">

我必须使用此代码

var input = document.querySelector("input");

input.value

而不是这一个

input.textContent

只是想更清楚地了解每一个。

Answer 1

来自MDN：

[...] textContent返回每个子节点的textContent的串联，不包括注释和处理指令。如果节点没有子节点，则为空字符串。

从本质上讲，textContent为您提供节点所包含内容的文本表示。可以把它想象成开始标记和结束标记之间的所有内容，例如

console.log(document.querySelector('span').textContent);

<span> this text </span> but not this one

然而<input>元素cannot have children (content model: nothing)。与它们关联的值只能通过value属性访问。