利用,
getElementsByName获得想要操作的对象。返回值是可读可写的。
因此,
修改为全选代码:
function checkall() {var alls = document.getElementsByName("hobby");// alert(alls)// alert(alls.length)// alert(alls[0].value)alls[0].checked = "checked"alls[1].checked = "checked"alls[2].checked = "checked"}
修改为全不选代码:
function checkno() {var alls = document.getElementsByName("hobby");alls[0].checked = ""alls[1].checked = ""alls[2].checked = ""}
整体代码:
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Title</title><script type="text/javascript">function checkall() {var alls = document.getElementsByName("hobby");// alert(alls)// alert(alls.length)// alert(alls[0].value)alls[0].checked = "checked"alls[1].checked = "checked"alls[2].checked = "checked"}function checkno() {var alls = document.getElementsByName("hobby");alls[0].checked = ""alls[1].checked = ""alls[2].checked = ""}</script></head>兴趣爱好:<input type="checkbox" name="hobby" value="1" >1<input type="checkbox" name="hobby" value="2" >2<input type="checkbox" name="hobby" value="3" >3<br><button onclick="checkall()">全选</button><button onclick="checkno()">全不选</button></body></html>
结果:
初始状态:
点击全选:
点击全不选: