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

What's the difference between document.getElementById("test").value and document.getElementById("test").innerHTML

提问by user784637

document.getElementById("test").value

document.getElementById("test").innerHTML

Does the first mean the address and the second mean the value stored at the address? Also, where can I find documentation on the valueproperty?

第一个表示地址，第二个表示存储在地址中的值吗？另外，我在哪里可以找到有关该value物业的文件？

回答by David says reinstate Monica

.valuegives you the currently-set value of a form element (input, select, textarea), whereas .innerHTMLbuilds an HTML string based on the DOM nodes the element contains.

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

For a simple example, go to the JS Fiddle demo, and enter a new value into the inputand then move out of the input.

举个简单的例子，转至JS Fiddle 演示，在 中输入一个新值input，然后移出输入。

The test uses the following JavaScript:

该测试使用以下 JavaScript：

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

(The above text updated, following a comment left by am not i am, in comments below.)

（在下面的评论中，在am not i am留下的评论之后，上面的文字已更新。）

回答by user784637

some HTMLelements have an attribute "value", such as <input/>some others don't have it.

有些HTML元素有一个属性"value"，比如有些元素<input/>没有。

if you want to modify them, you may use the DOM attribute (used with Javascript) innerHTML(if they have any). this attribute represents the content of an element, so it may be used for elements accepting to nest other element such as <div/>,

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

回答by MPelletier

Many elements in HTML can have an ID, so the definition of valuewill change for each.

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

valuewill be essentially what that element understands as a value. For example, an <input type=text>would give you the text inside.

value将本质上是该元素所理解的值。例如， an<input type=text>会给你里面的文字。

innerHTMLwill be what HTML code is inside. For example, a <TR>would have its child TD's, plus whatever else is in there.

innerHTML将是里面的 HTML 代码。例如， a<TR>将有它的 child TD，加上那里的其他任何东西。

valueand innerHTMLcan (usually) be written to, as well as read.

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

回答by Celeritas

It has to do with how some tags work based on their attributes where others work on the text between the opening and closing tags.

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

.valueretrieves whatever value is set for the valueattribute of the tag. .innerHTMLretrieves whatever is in between the opening and closing tag.

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

For example if the HTML tag was
<input type="text" value="Enter name here" id="user_name" />
and you used the JavaScript
var name = document.getElementById('user_name').value
would declare a variable nameand give it the value "Enter name here" (assuming the user didn't change it). On the other hand if you have HTML like
<div id="abc">blah blah</div>
then you would use
var text = document.getElementById('abc')
and that would set the variable textto "blah blah".

例如，如果 HTML 标记是
<input type="text" value="Enter name here" id="user_name" />
并且您使用 JavaScript
var name = document.getElementById('user_name').value
将声明一个变量name并为其赋予值“在此处输入名称”（假设用户没有更改它）。另一方面，如果您有这样的 HTML，
<div id="abc">blah blah</div>
那么您将使用
var text = document.getElementById('abc')
并将变量设置text为“blah blah”。

回答by santosh devnath

document.getElementByid('test').value

is use to give value in a text field. Like

用于在文本字段中给出值。喜欢

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

Now it put value in this text feild.

现在它把价值放在这个文本领域。

While document.getElementByid('test').innerHTMLis use to to give value in a specified area. Like

Whiledocument.getElementByid('test').innerHTML用于在指定区域内赋予价值。喜欢

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

Now it print the value within the div area.

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