老程序员分享:js实现复选框的全选、全部选和反选

简介: 老程序员分享:js实现复选框的全选、全部选和反选

"

1

2

3

4

5 checkbox

6

7 .main{

8 width: 400px;

9 height: 400px;

10 margin: 20px auto;

11 }

12 li{

13 list-style: none;

14 text-shadow: 5px 5px 3px rgba(53,56,41,0.5);

15 }

16 h3{

17 text-align: //代码效果参考:https://v.youku.com/v_show/id_XNjQwNjU2Nzg0MA==.html

center;

18 text-shadow: 5px 5px 3px rgba(53,56,41,0.5);

19 color: blue;

20 }

21 .boxs,.choice{

22 position: relative;

23 left: 100px;

24 }

25

26

27

28

29

30

31 赛季最佳球员候选

32

33

34 梅西

35 内马尔

36 苏亚雷斯

37 伊列斯塔

38 罗伯托

39 拉基蒂奇

40

41

42

43 全选

44 全不选

45 反选

46

47

48

49

50 function select(num)

51 {

52 var items = document.getElementsByTagName('input')

53 for(var i=0; i

54 {

55 switch(num)

56 {

57 case 1:items【i】.checked = true;break;

58 case //代码效果参考:https://v.youku.com/v_show/id_XNjQwNjU3MDUyNA==.html

2:items【i】.checked = false;break;

59 case 3:items【i】.checked= !items【i】.checked;break;

60

61 }

63 }

64 }

65

66

67


"
image.png
相关文章
|
2月前
|
JavaScript 前端开发
JavaScript实现复选框全选与全不选的效果
JavaScript实现复选框全选与全不选的效果
|
10天前
|
JavaScript 前端开发
杨老师课堂之JavaScript案例全选、全不选、及反选
杨老师课堂之JavaScript案例全选、全不选、及反选
11 1
|
5天前
|
Web App开发 JavaScript 前端开发
程序员必知:【three.js练习程序】创建地球贴图
程序员必知:【three.js练习程序】创建地球贴图
14 0
|
3天前
|
缓存 JavaScript 前端开发
老程序员分享:js刷新页面得重新加载和页面的刷新
老程序员分享:js刷新页面得重新加载和页面的刷新
|
3天前
|
缓存 JavaScript 前端开发
程序员必知:广告等第三方应用嵌入到web页面方案之使用js片段
程序员必知:广告等第三方应用嵌入到web页面方案之使用js片段
|
3天前
|
JavaScript 前端开发 IDE
程序员必知:WPSJSA宏编程(JS):1.初识
程序员必知:WPSJSA宏编程(JS):1.初识
10 0
|
3天前
|
JavaScript 程序员 索引
老程序员分享:JS基础知识(正则)
老程序员分享:JS基础知识(正则)
|
4天前
|
JavaScript 前端开发 小程序
老程序员分享:js中自然日的计算
老程序员分享:js中自然日的计算
|
4天前
|
JavaScript 程序员
老程序员分享:JS日期格式转换
老程序员分享:JS日期格式转换
|
4天前
|
JavaScript 前端开发 IDE
程序员必知:WPSJSA宏编程(JS):1.初识
程序员必知:WPSJSA宏编程(JS):1.初识