<html>
<head>
<title>TEST</title>
<script>
function disableCheckBox(checkboxid,option){
var checker=document.getElementById(checkboxid)
var checkerbox=checker.parentNode
if(option==true){
checker.disabled=true
checkerbox.className="disabledchecker"//修改CSS
}else{
checker.disabled=false
checkerbox.className="enabledchecker"
}
}
</script>
<style>
.enabledchecker{ font-weight:bold}
.disabledchecker{ text-decoration:line-through}
</style>
</head>
<body>
<label><input type="checkbox" name="ctrl" onClick="disableCheckBox('checker',this.checked)" />Disable the checkbox below</label><br />
<label class="enabledchecker"><input type="checkbox" id="checker" name="checker"/>Checker</label>
</body>
</html>
checked 属性规定在页面加载时应该被预先选定的 input 元素。checked 属性 与 <input type="checkbox">或 <input type="radio">配合使用。
并不是checked="true"
具体用法如下
<input type="radio" checked />
或
<input type="radio" checked="checked" />
第一条规则：
拆分解释：
input、ol都为标签选择器，选择标签名为input和ol的所有标签
:checked，选择勾选状态的元素（input为checkbox的，并且已经勾选）
+为兄弟选择器，代表+两侧的元素是前后紧邻的
整体解释：选择紧邻前面的标签为选中的checkbox（input type=checkbox）的ol标签（选择器选的是ol而不是input）
第二条规则：
拆分解释：
input、ol、li为标签选择器
>子元素选择器，表示>之前的元素是后面元素的父级元素
整体解释：选择被选中的input紧邻的ol元素的子元素li
举例，下面的li会匹配input:checked + ol >li
<input type="checkbox" /><ol>
<li>选择的是这个元素,前提是上面的checkbox已经被勾选了</li>
</ol>
