logo标签列表

JS中".innerHTML"和".value"的区别

javascript
14

我对JavaScript中的.innerHTML和.value之间的区别感到困惑。以下是我的代码：

<body>
Input string: <input type="text" id="input" />
....
</body>

当我使用这段代码时，无法获取输入字符串的内容：

var str=document.getElementById("input").innerHTML;

我使用以下代码时它有效：

var str=document.getElementById("input").value;

有人知道它们之间的区别吗？

4个回答
24

value指的是输入元素（或文本区域）的值

<input value="hello world">

值将是"hello world"（或键入的任何值）

innerHTML指的是HTML元素内部的内容。

<div>
  <span class="hello">
     All tags and their children are include in innerHTML.
  </span>
  All this is part of innerHTML.
</div>
标签的innerHTML将是以下字符串：
  '<span class="hello">
     All tags and their children are include in innerHTML.
  </span>
  All this is part of innerHTML.'
4

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

3
.innerHTML属性是指所分配的文字HTML标记，一旦被解释和合并到当前文档的DOM（文档对象模型）中。另一方面，.value属性仅指通常是HTML输入控件（例如文本框）的内容。并不是每个HTML元素都支持input属性，而大多数（如果不是全部）都支持innerHTML属性。
-2

.innerHTML 用于将元素插入到 DOM 中，value 是作为输出显示的任何内容。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接