在前端开发中，经常需要判断 HTML 页面中的复选框元素是否被选中。本文将介绍如何使用 JavaScript 检查复选框是否被选中，并提供示例代码和指导意义。
HTML 复选框基础知识
HTML 中的复选框是一种表单元素，允许用户选择一个或多个选项。复选框的基本语法如下：
<input type="checkbox" name="option1" value="1"> Option 1 <input type="checkbox" name="option2" value="2"> Option 2
其中 type="checkbox" 表示这是一个复选框，name 属性用于标识该复选框的名称（同一组复选框应具有相同的名称），value 属性用于指定该复选框的值。
检查复选框是否被选中
要检查复选框是否被选中，可以使用 JavaScript 中的 checked 属性。该属性返回一个布尔值，表示复选框是否被选中。示例代码如下：
-- -------------------- ---- -------
------ --------------- ---------------- -- --------
------- --------------------------------
--------
-------- ------- -
--- -------- - --------------------------------------
-- ------------------ -
---------- -------- -- -----------
- ---- -
---------- -------- -- --- -----------
-
-
---------在上面的示例代码中，我们创建了一个 id 为 myCheckbox 的复选框元素，并添加了一个按钮，点击按钮时会调用 check() 函数。在该函数中，我们使用 document.getElementById() 方法获取到复选框元素，并使用 checked 属性检查是否被选中。
指导意义
本文介绍了如何使用 JavaScript 检查 HTML 页面中的复选框是否被选中。而这种方法同样适用于单选框、开关等表单元素。深入理解表单元素的基础语法和属性，能够帮助我们更好地掌握前端开发技术。
此外，建议将 JavaScript 代码与 HTML 代码分离，使用外部 JS 文件或者模块化方式来管理代码，提高代码可维护性和复用性。
最后，当多个复选框存在且需要进行全选或反选操作时，可以使用 jQuery 等前端库提供的便捷方法来实现。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/10024
