JS全选和全不选

HTML部分：

<div id="div">
    <table>
        <caption>
            <h2>选择武器</h2>
        </caption>
        <thead>
            <tr>
                <th>
                    <input type="checkbox" id="all">
                </th>
                <th>武器</th>
                <th>奥义</th>
            </tr>
        </thead>
        <tbody id="content">
            <tr>
                <td>
                    <input type="checkbox">
                </td>
                <td>铁碎牙</td>
                <td>金刚爆流破</td>
            </tr>
            <tr>
                <td>
                    <input type="checkbox">
                </td>
                <td>天生牙</td>
                <td>冥道残月破</td>
            </tr>
            <tr>
                <td>
                    <input type="checkbox">
                </td>
                <td>梓山弓矢</td>
                <td>破魔净化</td>
            </tr>
            <tr>
                <td>
                    <input type="checkbox">
                </td>
                <td>爆碎牙</td>
                <td>苍龙破</td>
            </tr>
            <tr>
                <td>
                    <input type="checkbox">
                </td>
                <td>斗鬼神</td>
                <td>爆流破</td>
            </tr>
            <tr>
                <td>
                    <input type="checkbox">
                </td>
                <td>丛云牙</td>
                <td>狱龙破</td>
            </tr>
        </tbody>

    </table>
</div>

CSS部分：

    * {
	padding:0;
	margin:0;
}
#div {
	width:300px;
	margin:100px auto;
}
table {
	border-collapse:collapse;
	border-spacing:0;
	border:2px solid #ccc;
	width:300px;
}
th,td {
	border:1px solid #ccc;
	color:#000;
	padding:10px;
}
th {
	background-color:#09c;
	font:bold 18px "幼圆";
	color:#ffffff;
}
td {
	font:bold 16px "幼圆";
	text-align:center;
}
tr {
	background-color:rgb(237,238,240);
}
tr:hover {
	cursor:pointer;
	background-color:#fff;
}
body {
	background-color:#ccc;
}

js部分：

    function zy$(id) {
        return document.getElementById(id)
    };
    //获取元素
    var all = zy$("all");
    //获取所有的复选框
    var tbodyO = zy$("content").getElementsByTagName("input");
    //第一步，tbody中的状态和全选复选框状态一致
    //注册点击事件，添加事件处理函数
    all.onclick = function() {
        for (var i = 0; i < tbodyO.length; i++) {
            tbodyO[i].checked = this.checked;
        }
    };
    //第二步，tbody中的复选框状态，影响全选框
    //为tbody中所有的复选框注册点击事件
    for (var i = 0; i < tbodyO.length; i++) {
        tbodyO[i].onclick = function() {
            //设置一个变量为判断标识
            var flag = true;
            //循环遍历
            for (var j = 0; j < tbodyO.length; j++) {
                //只要存在没被勾选的复选框
                if (!tbodyO[j].checked) {
                    //判断标识为假，不影响全选框
                    flag = false;
                    break;
                }
            }
            all.checked = flag;
        };
    }