关于网页上的复选框checkbox的checked和value的问题

这个问题相信很多像我一样的非专业开发者遇到过，就是感觉checkbox是一个神奇的存在，为什么这么说？就是在开发网页过程中，有时候使用checkbox一切顺利，提交表单的时候用JavaScript检查它的checked或value的状态或取值都一切正常；但是又有些时候，无论在JavaScript中怎么折腾，感觉这个checkbox一点儿不听话，明明已经选中了，checked的状态始终不变，真是头疼。

当然，上网学习过，MDN的标准答案是：

如果一个复选框在其表单被提交时没有被选中，就不会有任何代表其未被选中的状态（例如 value=unchecked）的值被提交给服务器——该值根本就没有被提交给服务器！如果你想在复选框未被选中时提交一个默认值，你可以在表单中加入一个具有相同的 name 和 value 的 <input type="hidden"> 字段，它可以由 JavaScript 生成。

checked：

一个布尔属性，表示该复选框是否被默认选中（当页面加载时）。它不表示这个复选框当前是否被选中：如果复选框的状态被改变，这个内容属性不反映这个变化。此时，只有 HTMLInputElement 的 IDL 属性 checked 会更新。

怎么样？是不是好像弄懂了一点东西，但是好像又不是特别明白的样子。假如一个复选框的状态被改变，checked属性不反映这个变化！这时什么意思？如果不变化，那么为什么有些页面它表现又那么正常呢？

经过认真学习思考，我终于得到了我自己的结论，可以翻译成大白话，是个程序员都能明白：

就是复选框在form表单中提交的时候，它会很正常！！！划重点，在“表单中提交时”，一个字也不能少！！！其实MDN的解释里有说，只是没有太过强调罢了。再翻译一下，先假设有这么个场景：

如果为了方便用户，比如在用户设置某些选项时，希望把复选框当成一个开关来用，选中表示“开”，不选中表示“关”，直接根据复选框状态后台就更新数据库里的状态，而不需要用户有提交表单的动作。假如你此时 没.有. 在页面中制作一个表单，只是 单.独. 一个复选框，然后希望用JavaScript来处理后续，那么你就惨了，你会发现无论你怎么折腾，貌似都不能得到当前复选框的“checked”状态，挠头吧？！

其实，这是对的，因为复选框本来就是这个德行，没有表单的提交动作，checked状态是不会跟着用户的鼠标点击勾选而变化的，你只是在页面上看到了框里多了一个勾或变成了一个空的框框，就只是“看到”而已。

那么，假如想在页面上实现前述功能，想让复选框像个开关一样直接起作用的话怎么做？

答案也很简单，如果不想麻烦而使用表单来实现，就扔掉checkbox，换言之就可以只是把checkbox当一个摆设，只是给用户的眼睛看状态，就好了呀！真正用JavaScript处理的东西可以是和checkbox一点关系都没有的，比如我们可以在JS里设一个变量来记录，或者给页面上某个dom元素添加一个属性来记录我们需要的状态，比如：<div id='switch' status='0'></div>，用户点一下checkbox，我们就把“status”值在“0“和”1“之间做个变化，不要去读checked是true or false，直接读写switch元素的status属性值就好。

好吧，也许我的理解并不完全正确，但是以我目前的三脚猫水平而言，事实好像就是如此。