react 全选反选_js中怎么将createElement出来的复选框实现全选，全不选，反选效果？...

const checkBoxs = ["篮球","足球","羽毛球","乒乓球"];

const creactCheckBox = text => {

let checkBox = document.createElement("input");

checkBox.setAttribute("type","checkBox");

document.body.insertAdjacentElement("beforeend", checkBox);

document.body.insertAdjacentText("beforeend", text);

};

checkBoxs.forEach((item,index) => creactCheckBox(item));

const selector = dom => document.querySelectorAll(dom);

const [checkAllBtn,checkNotBtn,checkRevBtn] = [selector("#checkAllBtn")[0],selector("#checkNotBtn")[0],selector("#checkRevBtn")[0]];

const actions = {

checkAll(){

selector("input[type='checkBox']").forEach(function (option,index) {

option.checked = true

})

checkNot(){

selector("input[type='checkBox']").forEach(function (option,index) {

option.checked = false

})

checkRev(){

selector("input[type='checkBox']").forEach(function (option,index) {

option.checked ? option.checked = false : option.checked = true

})

}

};

checkAllBtn.addEventListener("click",function(){actions.checkAll()});

checkNotBtn.addEventListener("click",function(){actions.checkNot()});

checkRevBtn.addEventListener("click",function(){actions.checkRev()})

花了三分钟帮你写,包含ES6箭头函数

const

forEach

解构赋值

querySelectorAll

react 全选反选_js中怎么将createElement出来的复选框实现全选，全不选，反选效果？...相关推荐

linux 中etc全拼,英语中“等等”缩写成为etc.吗？要加一点吗？全拼是...
小编:英语中等等缩写成为etc.吗?要加一点吗?全拼是... 英语中等等缩写成为etc.吗?要加一点吗?全拼是... etc.是英语中等等缩写,全拼是 etcetera .要加一点,加一点是缩写词的稳 ...
我如何使用React和Typescript在freeCodeCamp中构建天气应用
by Kelvin Mai 通过凯文麦我如何使用React和Typescript在freeCodeCamp中构建天气应用 (How I built the weather app in freeCo ...
在 jquery repeater 中添加设置日期,下拉,复选框等控件
JQueryElement 更新到了 3.5.1, 今天给大家主要讲下如何在 Repeater 的模板中添加设置一些控件. 由于精力有限, 不能在多个博客中保证文章的同步, 可在如下地址查看最新内容, ...
2020年拼多多校招面试题及答案-最全最新-持续更新中（2）
大家好我是好好学习天天编程的天天一个整天在互联网上种菜和砍柴的程序员~ 2020年拼多多校招面试题及答案-最全最新-持续更新中(2) 2020年拼多多校招面试题一面 2020年拼多多校招面试题一面- ...
Python中Print()函数的用法___实例详解（二）(全，例多）
Python中Print()函数的用法___实例详解(二)(全,例多) 目录十一.Print()小例子十二.Print()中文输入显示乱码问题十三.Print()写入文件十四.print()在 ...
全基因组关联分析中上位性检测算法的研究
全基因组关联分析中上位性检测算法的研究前言这个项目主要是分享一些全基因组关联分析中上位性检测算法的研究经验,算是,怎么入门,写这么个东西,一是做总结,二是咱实验室估计以后还会有做这个方向的,备着吧 ...
卷积为什么如此强大？一文全解深度学习中的卷积
卷积为什么如此强大?一文全解深度学习中的卷积 2018年05月10日 15:52:41 七月在线实验室阅读数:17112 作者:Tim Dettmers(Understanding Convolut ...
[react] 你有在项目中使用过Yeoman脚手架吗？
[react] 你有在项目中使用过Yeoman脚手架吗? 前端工程化脚手架部分必备的依赖,用于初始化生成规范的项目目录个人简介我是歌谣,欢迎和大家一起交流前后端知识.放弃很容易, 但坚持一定很酷. ...
在DataGrid中选择,确认,删除多行复选框列表
在DataGrid中选择,确认,删除多行复选框列表 Selecting, Confirming & Deleting Multiple Checkbox Items In A DataGrid ...

react 全选反选_js中怎么将createElement出来的复选框实现全选，全不选，反选效果？...

react 全选反选_js中怎么将createElement出来的复选框实现全选，全不选，反选效果？...相关推荐

最新文章

热门文章