js：全选和全不选（获取属性、getElementById方法与getElementsByName方法）

1、全选和全不选函数：

<script>
            function checkAll(){
                var checkAllEle = document.getElementById("checkAll");
                if(checkAllEle.checked==true){
                    var checkOnes = document.getElementsByName("checkOne");
                    for(var i=0;i<checkOnes.length;i++){
                        checkOnes[i].checked=true;
                    }
                }else{
                    var checkOnes = document.getElementsByName("checkOne");
                    for(var i=0;i<checkOnes.length;i++){
                        checkOnes[i].checked=false;
                    }
                }
            }
</script>

getElementById方法：返回对拥有指定ID的第一个对象的引用。

getElementsByName方法：返回带有指定名称的对象的集合。

 <tr>
            	<th><input type="checkbox" onclick="checkAll()" id="checkAll"/></th>
				<th bgcolor="blanchedalmond "align="middle" >序号</th>              
				<th bgcolor="blanchedalmond "align="middle ">学号</th>
				<th bgcolor="blanchedalmond "align="middle ">姓名</th>
				<th bgcolor="blanchedalmond "align="middle ">平时成绩</th>
				<th bgcolor="blanchedalmond "align="middle ">期末成绩</td>
				<th bgcolor="blanchedalmond "align="middle ">学期总成绩</th>
            </tr>
            
			<tr>
				<td><input type="checkbox" name="checkOne"/></td>
				<td align="middle ">1</td>
				<td align="middle ">20100300201</td>
				<td align="middle ">张小丽</td>
				<td align="middle ">95</td>
				<td align="middle ">95</td>
				<td align="middle ">95</td>
			</tr>

			<tr>
				<td><input type="checkbox" name="checkOne"/></td>
				<td bgcolor="grey "align="middle ">2</td>
				<td bgcolor="grey "align="middle ">20100300202</td>
				<td bgcolor="grey "align="middle ">李宁</td>
				<td bgcolor="grey "align="middle ">90</td>
				<td bgcolor="grey "align="middle ">88</td>
				<td bgcolor="grey "align="middle ">89</td>
			</tr>

			<tr>
				<td><input type="checkbox" name="checkOne"/></td>
				<td align="middle ">3</td>
				<td align="middle ">20100300203</td>
				<td align="middle ">刘梅</td>
				<td align="middle ">98</td>
				<td align="middle ">92</td>
				<td align="middle ">95</td>
			</tr>

			<tr>
				<td><input type="checkbox" name="checkOne"/></td>
				<td bgcolor="grey "align="middle ">4</td>
				<td bgcolor="grey "align="middle ">20100300204</td>
				<td bgcolor="grey "align="middle ">王刚</td>
				<td bgcolor="grey "align="middle ">98</td>
				<td bgcolor="grey "align="middle ">90</td>
				<td bgcolor="grey "align="middle ">94</td>
			</tr>

			<tr>
				<td><input type="checkbox" name="checkOne"/></td>
				<td align="middle ">5</td>
				<td align="middle ">20100300205</td>
				<td align="middle ">郑军</td>
				<td align="middle ">90</td>
				<td align="middle ">85</td>
				<td align="middle ">87</td>
			</tr>

			<tr>
				<td><input type="checkbox" name="checkOne"/></td>
				<td bgcolor="grey "align="middle ">6</td>
				<td bgcolor="grey "align="middle ">20100300206</td>
				<td bgcolor="grey "align="middle ">杨波</td>
				<td bgcolor="grey "align="middle ">80</td>
				<td bgcolor="grey "align="middle ">80</td>
				<td bgcolor="grey "align="middle ">80</td>
			</tr>

getElementById方法获取的是与属性在同一行的复选框的状态，如果已经选中就用getElementsByName方法获取一个集合，并对集合进行遍历将复选框的状态变为选中，否则，将复选框全部变为未选中。
2、完整代码：

<html>
    <head>
        <meta charset="utf-8">
        <title>全选和全不选</title>
        <script>
            function checkAll(){
                var checkAllEle = document.getElementById("checkAll");
                if(checkAllEle.checked==true){
                    var checkOnes = document.getElementsByName("checkOne");
                    for(var i=0;i<checkOnes.length;i++){
                        checkOnes[i].checked=true;
                    }
                }else{
                    var checkOnes = document.getElementsByName("checkOne");
                    for(var i=0;i<checkOnes.length;i++){
                        checkOnes[i].checked=false;
                    }
                }
            }
        </script>
    </head>

    <body>
        <table width="600" border="1"  align="center" cellpadding="5" cellspacing="3">
            <caption>成绩登记表</caption>
            <tr>
                <th><input type="checkbox" onclick="checkAll()" id="checkAll"/></th>
                <th bgcolor="blanchedalmond "align="middle" >序号</th>              
                <th bgcolor="blanchedalmond "align="middle ">学号</th>
                <th bgcolor="blanchedalmond "align="middle ">姓名</th>
                <th bgcolor="blanchedalmond "align="middle ">平时成绩</th>
                <th bgcolor="blanchedalmond "align="middle ">期末成绩</td>
                <th bgcolor="blanchedalmond "align="middle ">学期总成绩</th>
            </tr>
            
            <tr>
                <td><input type="checkbox" name="checkOne"/></td>
                <td align="middle ">1</td>
                <td align="middle ">20100300201</td>
                <td align="middle ">张小丽</td>
                <td align="middle ">95</td>
                <td align="middle ">95</td>
                <td align="middle ">95</td>
            </tr>

            <tr>
                <td><input type="checkbox" name="checkOne"/></td>
                <td bgcolor="grey "align="middle ">2</td>
                <td bgcolor="grey "align="middle ">20100300202</td>
                <td bgcolor="grey "align="middle ">李宁</td>
                <td bgcolor="grey "align="middle ">90</td>
                <td bgcolor="grey "align="middle ">88</td>
                <td bgcolor="grey "align="middle ">89</td>
            </tr>

            <tr>
                <td><input type="checkbox" name="checkOne"/></td>
                <td align="middle ">3</td>
                <td align="middle ">20100300203</td>
                <td align="middle ">刘梅</td>
                <td align="middle ">98</td>
                <td align="middle ">92</td>
                <td align="middle ">95</td>
            </tr>

            <tr>
                <td><input type="checkbox" name="checkOne"/></td>
                <td bgcolor="grey "align="middle ">4</td>
                <td bgcolor="grey "align="middle ">20100300204</td>
                <td bgcolor="grey "align="middle ">王刚</td>
                <td bgcolor="grey "align="middle ">98</td>
                <td bgcolor="grey "align="middle ">90</td>
                <td bgcolor="grey "align="middle ">94</td>
            </tr>

            <tr>
                <td><input type="checkbox" name="checkOne"/></td>
                <td align="middle ">5</td>
                <td align="middle ">20100300205</td>
                <td align="middle ">郑军</td>
                <td align="middle ">90</td>
                <td align="middle ">85</td>
                <td align="middle ">87</td>
            </tr>

            <tr>
                <td><input type="checkbox" name="checkOne"/></td>
                <td bgcolor="grey "align="middle ">6</td>
                <td bgcolor="grey "align="middle ">20100300206</td>
                <td bgcolor="grey "align="middle ">杨波</td>
                <td bgcolor="grey "align="middle ">80</td>
                <td bgcolor="grey "align="middle ">80</td>
                <td bgcolor="grey "align="middle ">80</td>
            </tr>
        </table>
</body>
</html>

相关阅读:
DS4700磁盘阵列的控制器微码升级操作记录(收录百度文库)
Android 解决布局无法对齐的情况
 android 模仿大众点评团购卷列表多余3条时折叠,点击时显示剩余全部的功能
 android 解决ScrollView中的子布局不能够填充整个ScrollView的情况。
Android在代码中设置控件的drawableLeft，drawableRight，drawableTop，drawableBottom。
android RadioGroup中设置selector后出现多个别选中的RadioButton的解决办法
 Android 动态的给Button、TextView、ImageView等控件设置了background后，再设置padding属性时该属性不起作用
 Android Universal Image Loader java.io.FileNotFoundException: http:/xxx/lxx/xxxx.jpg
Android2.3系统自定义的PopupWindow在实例化时报空指针异常
 android精品开源项目整理
原文地址：https://www.cnblogs.com/zhai1997/p/12230382.html