摘要:<html> <head> <meta charset="utf-8"> <title>全选</title> <style type="te
<html>
<head>
<meta charset="utf-8">
<title>全选</title>
<style type="text/css"> table {
width: 200px;
text-align: center;
margin: 20px auto;
} </style>
<script type="text/javascript"> function checkall() {
var checkall, item;
checkall = document.getElementById('checkall') //获取全选 item=document.getElementsByName('item[]') //获取勾选框 for (var i = 0; i < item.length; i++) { if (checkall.checked) { //checked 是选中 item[i].checked=true; //如果全选框被选中,则勾选框选中 } else { item[i].checked=false; //反之 } } } </script>
</head>
<body>
<div class="box">
<table border="1px">
<tr>
<th><input type="checkbox" id="checkall" onclick="checkall()"/>全选</th>
<th>选项</th>
</tr>
<tr>
<td><input type="checkbox" name="item[]"/></td>
<td>html</td>
</tr>
<tr>
<td><input type="checkbox" name="item[]"/></td>
<td>css</td>
</tr>
<tr>
<td><input type="checkbox" name="item[]"/></td>
<td>JavaScript</td>
</tr>
<tr>
<td><input type="checkbox" name="item[]"/></td>
<td>jQuery</td>
</tr>
<tr>
<td><input type="checkbox" name="item[]"/></td>
<td>web</td>
</tr>
</table>
</div>
</body>
</html>是用table做的,样式可以好看点,另外不需要设置很多div的属性
批改老师:韦小宝批改时间:2018-11-02 10:58:42
老师总结:很不错!使用table当然也可以完成!在早一段时间还有人使用table直接对对网页继续布局呢!不过个人感觉并没有div方法!但是多了解一种方法也是很不错的体验!看好你!是一个学习的好料哦!哈哈!不要骄