获取元素的 value 属性值
要获取一个元素的 value 属性值，我们可以使用 JavaScript 来操作。可以通过 document.getElementById、document.querySelector 等方法获取到对应的元素，然后通过 element.value 来获取其值。
示例代码：
// 获取 id 为 "inputBox" 的输入框的值
var inputBox = document.getElementById("inputBox");
var value = inputBox.value;
console.log(value);设置元素的 value 属性值
同样地，我们也可以通过 JavaScript 来设置一个元素的 value 属性值。只需要将新的值赋给 element.value 即可。
示例代码：
// 设置 id 为 "inputBox" 的输入框的值为 "Hello World"
var inputBox = document.getElementById("inputBox");
inputBox.value = "Hello World";应用场景
表单操作
在表单中，我们经常需要获取用户输入的值，然后进行相应的处理。通过获取和设置元素的 value 属性，我们可以轻松地实现这些功能。
示例代码：
// www.javascriptcn.com code example
<input type="text" id="username" placeholder="请输入用户名">
<button onclick="submitForm()">提交</button>
<script>
function submitForm() {
var username = document.getElementById("username").value;
alert("您输入的用户名是：" + username);
}
</script>动态更新页面内容
有时候我们需要根据用户的输入动态更新页面的内容。通过监听输入框的 input 事件，我们可以实时获取输入框的值，并将其展示在页面上。
示例代码：
// www.javascriptcn.com code example
<input type="text" id="inputBox" oninput="updateContent()">
<p id="output"></p>
<script>
function updateContent() {
var inputBox = document.getElementById("inputBox");
var output = document.getElementById("output");
output.innerText = inputBox.value;
}
</script>总结
通过 HTML DOM 的 value 属性，我们可以方便地操作页面上的元素值，实现各种功能。希會本教程能帮助您更好地理解和应用 value 属性。