给出input.value和input.textContent之间的区别。为什么用一种代替另一种？

Question

为什么使用 input.value 代替 input.textContent 。两者有什么区别？

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

<input type="number">

我必须使用此代码

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

input.value

代替这个

input.textContent

只想对它们有一个更清晰的了解。

Answer 1

只有输入元素具有“值”。它代表用户提供的或代码最初提供的输入数据。而 textContent 属性设置或返回指定节点及其所有后代的文本内容。

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

Answer 2

来自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属性来访问。