JavaScript 中的 .value 属性147

在 JavaScript 中，.value 属性用于获取或设置表单元素（如输入框、文本区域或选择框）的值。它是一个字符串属性，包含元素中包含的文本或选定的值。

获取表单元素的值

要获取表单元素的值，可以使用以下语法：const value = ;

其中 element 是要获取其值的表单元素。

示例：

const inputValue = ("myInput").value;

此代码将获取 id 为 myInput 的输入框中的值并将其存储在 inputValue 变量中。

设置表单元素的值

要设置表单元素的值，可以使用以下语法： = newValue;

其中 element 是要设置其值的表单元素，newValue 是要设置的新值。

示例：

("myInput").value = "Hello World!";

此代码将设置 id 为 myInput 的输入框中的值，为 "Hello World!"。

选择框

对于选择框，.value 属性返回选定选项的 value 属性。如果选择框有多个选项，则 .value 属性返回一个数组，其中包含所有选定选项的 value 属性。

示例：

const selectedValue = ("mySelect").value;

此代码将获取 id 为 mySelect 的选择框中选定选项的值并将其存储在 selectedValue 变量中。

.value 在不同表单元素中的行为

.value 属性在不同的表单元素中表现不同：* 输入框：返回输入框中输入的文本。
* 文本区域：返回文本区域中输入的文本。
* 选择框（单选按钮）：返回选定的单选按钮的值。
* 选择框（多选按钮）：返回一个数组，其中包含所有选定多选按钮的值。
* 复选框：返回一个布尔值，指示复选框是否已选中。

使用 .value 的注意事项* 对于只读元素，不能使用 .value 属性来设置值。
* 如果表单元素不存在，则访问 .value 属性将引发错误。
* 在获取或设置值之前，始终检查元素是否存在。

示例代码
// 获取输入框的值
const inputValue = ("myInput").value;
// 设置输入框的值
("myInput").value = "Hello World!";
// 获取选择框的选定值
const selectedValue = ("mySelect").value;
// 设置选择框的选定值
("mySelect").value = "option2";

.value 属性是 JavaScript 中一个强大的工具，用于获取和设置表单元素的值。通过理解它在不同表单元素中的行为，你可以高效地操纵表单数据，提供更好的用户体验。

2024-12-13

---

上一篇：JavaScript 的 `eval()` 函数深入解析

下一篇：从新手到高手：深入剖析 JavaScript 中的 Value