zoukankan      html  css  js  c++  java
  • 全选与反选

    <!DOCTYPE html>
    <html>
    <head lang="en">
    <meta charset="UTF-8">
    <title>全选/反选</title>
    </head>
    <style type="text/css">
    *{
    padding:0px;
    margin:0px;
    }
    #content{
    800px;
    border:1px solid grey;
    /*margin:50px auto;*/
    }
    table th {
    200px;
    }
    table td{
    200px;
    text-align: center;
    }
    </style>
    <body>
    <div id="content">
    <table>
    <tr>
    <!-- <th>:table中的列标题(自动加粗)-->
    <th><input type="checkbox" name="setchoose">
    <th>学号</th>
    <th>姓名</th>
    <th>班级</th>
    </th>
    </tr>
    <tr>
    <td><input type="checkbox" name="setchoose">
    <td>001</td>
    <td>张三</td>
    <td>F07</td>
    </td>
    </tr>
    <tr>
    <td><input type="checkbox" name="setchoose">
    <td>001</td>
    <td>张三</td>
    <td>F07</td>
    </td>
    </tr>
    <tr>
    <td><input type="checkbox" name="setchoose">
    <td>001</td>
    <td>张三</td>
    <td>F07</td>
    </td>
    </tr>
    <tr>
    <td><input type="checkbox" name="setchoose">
    <td>001</td>
    <td>张三</td>
    <td>F07</td>
    </td>
    </tr>
    </table>
    </div>
    <!--按钮-->
    <input type="button" value="全选" onclick="allcheck()"/>
    <input type="button" value="反选" onclick="nocheck()"/>
    <script type="text/javascript">
    var chkall=document.getElementsByName("setchoose");//获取复选框的id
    // 全选
    function allcheck(){
    for(var i=0;i<chkall.length;i++){
    chkall[i].setAttribute("checked","checked");//默认选中
    }
    }
    // 全不选
    function nocheck(){
    for(var i=0;i<chkall.length;i++){
    chkall[i].removeAttribute("checked");//删除默认选中的属性
    }
    }
    </script>
    </body>
    </html>

    <!--1、属性操作:
    元数对象.setAttribute(属性名,属性的值);//设置属性的值,也可以添加属性的值
    元数对象.removeAttribute(属性名);//删除对应的属性
    元数对象.attributes;//返回这个元素上的所有属性,返回的是数组
    元数对象.getAttribute(属性名);//返回对应属性的值
    2、访问节点的四种方式:
    (1)document.getElementBYId(id名称)
    (2)document.getElementsBYTagName(标签名称)
    (3)document.getElementsBYClassName(类名称)
    (4)document.getElementsBYName(name值)
  • 相关阅读:
    Nacos和Eureka的区别以及选型
    将word中的标题和正文按照大纲等级导入到excel中
    jeecgboot启动gateway找不到路由的问题(跨域访问的问题)
    单点登录的整理
    使用批处理文件(.bat)同时启动多个CMD服务
    安装nacos启动报错以及版本对应关系问题解决
    关于Spring事务管理 之 默认事务间调用问题
    octopus 为梦而生的八爪鱼
    我太难了
    节日快乐
  • 原文地址:https://www.cnblogs.com/lqqchangeload/p/5942696.html
Copyright © 2011-2022 走看看