以下是一个简单的例子，演示如何使用 JavaScript 操控 <form> 元素：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Form Element Example</title>
</head>
<body>
<form id="myForm">
<label for="username">Username:</label>
<input type="text" id="username" name="username">
<br>
<label for="password">Password:</label>
<input type="password" id="password" name="password">
<br>
<input type="submit" value="Submit">
</form>
<button onclick="submitForm()">Submit Form</button>
<script>
// 获取 form 元素
var formElement = document.getElementById('myForm');
// 添加事件监听器，以便在表单提交时执行操作
formElement.addEventListener('submit', function(event) {
event.preventDefault(); // 阻止表单默认提交行为
console.log('Form submitted!');
});
// 定义手动提交表单的函数
function submitForm() {
formElement.submit();
}
</script>
</body>
</html>
在这个例子中，我们首先通过 getElementById 获取了一个具有特定 id（"myForm"）的 <form> 元素。然后，我们通过添加事件监听器，在表单提交时阻止默认的提交行为，并在控制台输出一条消息。我们还提供了一个按钮，点击按钮时调用 submitForm 函数以手动提交表单。
通过 JavaScript 操控 <form> 元素，你可以捕获表单提交事件、取消默认的提交行为、手动提交表单，以及访问表单中的输入元素等。这使得你能够在客户端实现对表单的动态控制。
转载请注明出处：http://www.zyzy.cn/article/detail/6203/JavaScript 和 HTML DOM