<form>
请选择你爱好:<br>
<input type="checkbox" name="hobby" id="hobby1"> 音乐
<input type="checkbox" name="hobby" id="hobby2"> 登山
<input type="checkbox" name="hobby" id="hobby3"> 游泳
<input type="checkbox" name="hobby" id="hobby4"> 阅读
<input type="checkbox" name="hobby" id="hobby5"> 打球
<input type="checkbox" name="hobby" id="hobby6"> 跑步 <br>
<input type="button" value = "全选" onclick = "checkall();">
<input type="button" value = "全不选" onclick = "clearall();">
</form>
<script>
function checkall(){
var input_all = document.getElementsByName("hobby");
for(var i=0;i<input_all.length;i++){
if(input_all[i].type==='checkbox'){
input_all[i].checked=true
}
}
}
function clearall(){
var input_all = document.getElementsByName("hobby");
for(var i=0;i<input_all.length;i++){
if(input_all[i].type==='checkbox'){
input_all[i].checked=false
}
}
}

</script>

js小功能1:全选全不选的更多相关文章

  1. js小功能整理

    /** * 判断是否包含字符串某字符串 * @param {[type]} str [被检测的字符串] * @param {[type]} substr [检测是否含有的字符串] * @return ...

  2. js小功能记录

    个人日常中遇到的js小功能记录,方便查看. /** * 判断是否包含字符串某字符串 * @param {[type]} str [被检测的字符串] * @param {[type]} substr [ ...

  3. 点滴积累【JS】---JS小功能(checkbox实现全选和全取消)

    效果: 代码: <head runat="server"> <title></title> <script type="text ...

  4. js小功能2:切换

    HTML: <div id="tb"> <ul><li class="on">房产</li><li> ...

  5. js小功能合集:计算指定时间距今多久、评论树核心代码、字符串替换和去除。

    1.计算指定时间距今多久 var date1=new Date('2017/02/08 17:00'); //开始时间 var date2=new Date(); //当前时间 var date3=d ...

  6. 点滴积累【JS】---JS小功能(JS实现模仿微博发布效果)

    效果: 思路: 利用多功能浮动运动框架实现微博效果,首先,将textarea中的属性添加到新创建的li里面然后,再将li添加到ul里面,再利用浮动运动框架将数据动态的显示出来. 代码: <hea ...

  7. 点滴积累【JS】---JS小功能(JS实现多功能缓冲运动框架)

    效果: 思路: 首先,多功能框架实现的功能是:css中所有的属性都可以添加进去(也可以把方法作为参数传递过去!),然后进行缓冲运动,比如:物体的高度.长度.颜色.字体大小.透明度等,都可以直接传入参数 ...

  8. 点滴积累【JS】---JS小功能(JS实现匀速运动)

    效果: 思路: 利用setInerval()计时器,进行运动.然后关键的一点是在最后停止的时候给它一个填充缝隙的判断. 代码: <head runat="server"> ...

  9. js小功能3:一个简单的计算器功能

    html: <input type='text' id='txt1' /> <select id='select'> <option value='+'>+< ...

随机推荐

  1. SQL:百科

    ylbtech-SQL:百科 结构化查询语言(Structured Query Language)简称SQL,是一种特殊目的的编程语言,是一种数据库查询和程序设计语言,用于存取数据以及查询.更新和管理 ...

  2. easyUI之Accordion(分类)

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  3. Rsa加密类

    需要导入Base64.jar包 import java.io.ByteArrayOutputStream; import java.security.Key; import java.security ...

  4. spring cloud之docker微服务客户端注册eureka问题

    正常我们起一个微服务注册到eureka他的实例id是默认这样的主机名称:服务名称:服务端口号, 如果配置eureka.instance.prefer-ip-address=true则实例id为主机Ip ...

  5. python 实例方法、类方法和静态方法

    #!/usr/bin/env python3.6 #-*- coding:utf-8 -*- # class Person(object): city = 'Beijing' def __init__ ...

  6. vagrant虚拟机共享目录在windows宿主下的禁忌

    问题背景 宿主环境:Windows10 开发环境:vagrant(ubuntu) 操作目录:synced_folder (共享目录 ) 执行命令:npm install 错误信息: npm ERR! ...

  7. 数组setArray和addObjectsFromArray的区别

    -setArray:用另一个数组中的所有对象来替换当前数组中的所有对象 -addObjectsFromArray:在原数组最后添加另一个数组的全部对象 NSArray *arr = @["] ...

  8. Spring Boot Mybatis简单使用

    Spring Boot Mybatis简单使用 步骤说明 build.gradle:依赖添加 application.properties:配置添加 代码编写 测试 build.gradle:依赖添加 ...

  9. window 安装指定的node版本

    有时候不同的项目需要不同的node版本,window切换node版本命令很不管用,甚至需要卸载后重新装,同事分享了一下他的做法,很便利. 1.打开node官网 https://nodejs.org/e ...

  10. linux 中的命令是什么?执行命令的几种方式?如何自己创建命令?

    linux 中的命令是什么? 命令是可执行的二进制程序 执行命令的几种方式? ./test.sh                     #相对路径执行 /data/test.sh           ...