JavaScript 是一种强大的编程语言，能够帮助开发者实现各种功能。本文将介绍如何使用 JavaScript 获取 Checkbox 选中的值。
使用 document.querySelector() 方法可以获取页面中的元素，这样就可以获取 Checkbox 的选中值了。下面是一个使用 document.querySelector() 方法获取 Checkbox 选中值的示例代码：
<input type="checkbox" name="fruit" value="apple"> Apple
<input type="checkbox" name="fruit" value="orange"> Orange
<input type="checkbox" name="fruit" value="banana"> Banana
<script>
var checkboxes = document.querySelectorAll('input[name="fruit"]');
var checkedValues = [];
for (var i = 0; i < checkboxes.length; i++) {
if (checkboxes[i].checked) {
checkedValues.push(checkboxes[i].value);
}
}
console.log(checkedValues); // ["apple", "orange"]
</script>
以上代码定义了三个 checkbox，使用 document.querySelectorAll() 方法获取这三个 checkbox，使用 for 循环遍历这三个 checkbox，如果某个 checkbox 被选中，就将它的 value 值添加到 checkedValues 数组中，输出 checkedValues 数组，就可以获取到被选中的 checkbox 的 value 值了。
使用 FormData 对象也可以获取 Checkbox 选中的值，下面是一个使用 FormData 对象获取 Checkbox 选中的值的示例代码：
<form>
<input type="checkbox" name="fruit" value="apple"> Apple
<input type="checkbox" name="fruit" value="orange"> Orange
<input type="checkbox" name="fruit" value="banana"> Banana
</form>
<script>
var formData = new FormData(document.forms[0]);
var checkedValues = [];
for (var value of formData.values()) {
checkedValues.push(value);
}
console.log(checkedValues); // ["apple", "orange"]
</script>
以上代码定义了一个表单，表单中包含三个 checkbox，使用 new FormData() 方法获取表单中的数据，使用 for...of 循环遍历 FormData 对象，将被选中的 checkbox 的 value 值添加到 checkedValues 数组中，输出 checkedValues 数组，就可以获取到被选中的 checkbox 的 value 值了。
本文介绍了如何使用 JavaScript 获取 Checkbox 选中的值，可以使用 document.querySelector() 方法或 FormData 对象来实现。通过本文，开发者可以使用 JavaScript 轻松获取 Checkbox 选中的值。
本文链接：http://task.lmcjl.com/news/13346.html