全选，反选，清除

来源：互联网发布：centos 6.8 安装pptp 编辑：程序博客网时间：2024/05/21 22:55

思路：

获取checkbox元素数组。添加按钮事件。全选：遍历数组，为每一个checked属性的值赋为"checked“或者true; 反选：遍历数组，判断，if(arr[i].checked)，则将其checked属性值置为""空,else{将checked属性值赋为"checked"或者true;}

代码：

<html><head><meta charset="utf-8"/><title>全选，反选</title><script>window.onload=function(){oDiv=document.getElementById("option");oInput=oDiv.getElementsByTagName("input");oChooseAll=document.getElementById("all");oReverse=document.getElementById("reverse");oChooseAll.onclick=function(){for(var i=0;i<oInput.length;i++){oInput[i].checked="checked";}}oReverse.onclick=function(){for(var i=0;i<oInput.length;i++){if(oInput[i].checked){oInput[i].checked="";}else{oInput[i].checked="checked";}}}}</script></head><body><div id="option"><input type="checkbox" />药材<br/><input type="checkbox" />药材<br/><input type="checkbox" />药材<br/><input type="checkbox" />药材<br/><input type="checkbox" />药材<br/><input type="checkbox" />药材<br/><input type="checkbox" />药材<br/><input type="checkbox" />药材<br/><input type="checkbox" />药材<br/><input type="checkbox" />药材<br/><input type="checkbox" />药材<br/><input type="checkbox" />药材<br/><input type="checkbox" />药材<br/><input type="checkbox" />药材<br/><input type="checkbox" />药材<br/><input type="checkbox" />药材<br/><input type="checkbox" />药材<br/><input type="checkbox" />药材<br/></div><input id="all" type="checkbox" />全选<input id="reverse" type="checkbox"/>反选</body></html>

0 0