document.getElementById("test").value 和 document.getElementById("test").innerHTML 有什么区别

Question

document.getElementById("test").value

document.getElementById("test").innerHTML

第一个表示地址，第二个表示该地址存储的值吗？另外，在哪里可以找到有关 value 属性的文档？

Answer 1

.value 为您提供表单元素当前设置的值（input、select、textarea），而.innerHTML 根据元素包含的 DOM 节点构建 HTML 字符串。

对于一个简单的示例，请转到 JS Fiddle 演示，然后在 输入，然后移出输入。

该测试使用以下 JavaScript：（

document.getElementById('input').onchange = function(){
    alert('innerHTML: ' + document.getElementById('input').innerHTML + '; whereas value: ' + document.getElementById('input').value);
};

根据 am not i am，在下面的评论中。）

Answer 2

某些 HTML 元素具有属性 "value"，例如 某些其他元素则没有该属性。

如果你想修改它们，你可以使用 DOM 属性（与 Javascript 一起使用）innerHTML（如果有的话）。该属性表示元素的内容，因此它可用于接受嵌套其他元素的元素，例如

，

Answer 3

HTML 中的许多元素都可以有一个 ID，因此每个元素的 value 的定义都会发生变化。

value 本质上就是该元素所理解的值。例如， 将为您提供其中的文本。

innerHTML 将是里面的 HTML 代码。例如， 将拥有其子 TD，以及其中的其他内容。

value 和 innerHTML（通常）可以写入和读取。

Answer 4

它与某些标签如何根据其属性工作而其他标签如何处理开始标签和结束标签之间的文本有关。

.value 检索为标记的 value 属性设置的任何值。 .innerHTML 检索开始标记和结束标记之间的所有内容。

例如，如果 HTML 标记是

并且您使用了 JavaScript
var name = document.getElementById('user_name').value
将声明一个变量 name 并为其赋予值“在此处输入名称”（假设用户没有更改它）。另一方面，如果你有像
这样的 HTML

blah blah
那么你会使用
var text = document.getElementById('abc')
这会将变量 text 设置为“blah blah”。

Answer 5

document.getElementByid('test').value

用于在文本字段中给出值。就像

<input type="text" id="test" name="test">

现在，它在这个文本字段中赋予了价值。

而 document.getElementByid('test').innerHTML
用于给出指定区域的值。就像

<div id="test">
</div>

现在一样，它打印 div 区域内的值。