HTML 5 & checkbox & switch components

<!DOCTYPE html>

<html lang="zh-Hans">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <meta name="author" content="xgqfrms">

    <meta name="generator" content="VS code">

    <title>checkbox & swicth components</title>

</head>

<body>

    <section>

        <input type="checkbox" name="vehicle" value="Bike"> I have a bike<br>

        <input type="checkbox" name="vehicle" value="Car"checked> I have a car<br>

    </section>

    <script>

        let cbs = [...document.querySelectorAll(`input[type="checkbox"]`)];

        console.log(`cbs =`, cbs);

        let v1 = cbs[0].checked;

        console.log(`v1 =`, v1, cbs[0].value);

        let v2 = cbs[1].checked;

        console.log(`v2 =`, v2, cbs[1].value);

    </script>

</body>

</html>

https://www.iviewui.com/components/switch

https://www.iviewui.com/components/progress

https://www.iviewui.com/components/rate

HTML 5 & checkbox & switch components的更多相关文章

  1. 论文阅读：Flow-level State Transition as a New Switch Primitive for SDN

    Name of article:Flow-level State Transition as a New Switch Primitive for SDN Origin of the article: ...

  2. 【转】GitHub 排名前 100 的安卓、iOS项目简介

    GitHub Android Libraries Top 100 简介 排名完全是根据 GitHub 搜索 Java 语言选择 (Best Match) 得到的结果, 然后过滤了跟 Android 不 ...

  3. GitHub Android Libraries Top 100 简介

    本项目主要对目前 GitHub 上排名前 100 的 Android 开源库进行简单的介绍, 至于排名完全是根据 GitHub 搜索 Java 语言选择 (Best Match) 得到的结果, 然后过 ...

  4. 2016年GitHub 排名前 100 的安卓、iOS项目简介（收藏）

    排名完全是根据 GitHub 搜索 Java 语言选择 (Best Match) 得到的结果, 然后过滤了跟 Android 不相关的项目, 所以排名并不具备任何官方效力, 仅供参考学习, 方便初学者 ...

  5. 64.GitHub 排名前100的android项目简介

    GitHub Android Libraries Top 100 简介 排名完全是根据 GitHub 搜索 Java 语言选择 (Best Match) 得到的结果, 然后过滤了跟 Android 不 ...

  6. 100个Github上Android开源库

    项目名称 项目简介 1. react-native 这个是 Facebook 在 React.js Conf 2015 大会上推出的基于 JavaScript 的开源框架 React Native, ...

  7. [ucgui] 对话框3——GUIBuilder生成界面c文件及修改

    >_<" 其实生成GUI有相应的工具:

  8. GitHub Top 100的Android开源库

    摘要: 本项目主要对目前 GitHub 上排名前 100 的 Android 开源库进行简单的介绍, 至于排名完全是根据GitHub搜索Java语言选择「Best M... 本项目主要对目前 GitH ...

  9. iPhone开发中的技巧整理

    1.NSCalendar用法 -(NSString *) getWeek:(NSDate *)d { NSCalendar *calendar = [[NSCalendar alloc] initWi ...

随机推荐

  1. 利用Bootstrap Paginator插件和KnockoutJS完成分页功能

    在最近一个项目中,需要结合一堆条件查询并对查询的结果数据完成一个简单分页功能,可是做着做着,自己的思路越来越模糊,做到心态崩溃!!! 哈哈,特此花点时间重新总结,并从最简单的分页,然后向多条件查询分页 ...

  2. JavaScript一看就懂(3)数组

    定义数组 var a = [1, 2, 3]; typeof a; //"object", 数组是对象 a.length; //数组长度 相关操作 a[0]; //下标访问 a.p ...

  3. MyBatis-plus二级缓存使用

    MyBatis二级缓存使用 注意点: 在最新的3.x版本,实现二级缓存的配置也有了一些改变. 官方建议在service使用缓存,但是你也可以直接在mapper层缓存,这里的二级缓存就是直接在Mappe ...

  4. 流水车间调度算法分析的简单+Leapms实践--混合整数规划的启发式建模

    流水车间调度算法分析的简单+Leapms实践--混合整数规划的启发式建模 清华大学出版社出版的白丹宇教授著作<流水车间与开放车间调度算法渐近分析>采用渐近分析方法分析多个NP-难类启发调度 ...

  5. Java高阶语法---transient

    背景:听说transient Java高阶语法是挺进BAT必经之路. transient: Java中transient 关键字的作用,简单的说就是让某些被修饰的成员属性变量不被序列化. 这又扯到了序 ...

  6. react 脚手架 立即可以写业务 react + react-router-dom + less + axios + antd

    https://github.com/cynthiawupore/wq-cli

  7. C# 离线人脸识别 ArcSoft V2.0 Demo

    本来打算做个C#版demo,但没用成功.使用虹软最新人脸识别技术开发完成 过程如下: 1. 传入一张单人脸照片: 2.调用检测人脸函数ASFDetectFaces,成功返回人脸信息的指针: 3.使用 ...

  8. SQL Server数据库文件与文件组总结

    文件和文件组概念 关于文件与文件组,简单概括如下,详情请参考官方文档"数据库文件和文件组Database Files and Filegroups"或更多相关资料: 数据文件概念: ...

  9. spark2.4 分布式安装

    一．Spark2.0的新特性Spark让我们引以为豪的一点就是所创建的API简单.直观.便于使用,Spark 2.0延续了这一传统,并在两个方面凸显了优势: 1.标准的SQL支持: 2.数据框(Dat ...

  10. EntityFramework Code-First—领域类配置之DataAnnotations

    本文出自:https://www.cnblogs.com/tang-tang/p/5510574.html 一.摘要 EF Code-First提供了一个可以用在领域类或其属性上的DataAnnota ...