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. 【面试】吃透了这些Redis知识点，面试官一定觉得你很NB（干货 | 建议珍藏）

    万字长文,干货满满. 是数据结构而非类型 很多文章都会说,redis支持5种常用的数据类型,这其实是存在很大的歧义.redis里存的都是二进制数据,其实就是字节数组(byte[]),这些字节数据是没有 ...

  2. C#语法——await与async的正确打开方式

    C#5.0推出了新语法,await与async,但相信大家还是很少使用它们.关于await与async有很多文章讲解,但有没有这样一种感觉,你看完后,总感觉这东西很不错,但用的时候,总是想不起来,或者 ...

  3. Java——泛型

    前言 一般的类和方法,使用的都是具体的类型:基本类型或者自定义的类.如果我们要编写出适用于多种类型的通用代码,那么肯定就不能使用具体的类型.前面我们介绍过多态,多态算是一种泛化机制,但是也会拘泥于继承 ...

  4. SpringBoot+Dubbo+Zookeeper整合搭建简单的分布式应用

    为什么要使用分布式系统? 容错 减少延迟/提高性能 可用性 负载均衡 总而言之,其实目的只有一个,”用户体验“. 什么是分布式系统? 分布式系统是由使用分发中间件连接的自治计算机组成的网络.它们有助于 ...

  5. asp.net 仿微信端菜单设置

    第一步:添加引用文件 <link rel="stylesheet" href="~/assets/css/bootstrap.min.css"> & ...

  6. 洛谷P3366 【模板】最小生成树(Boruvka算法)

    题意 题目链接 Sol 自己yy着写了一下Boruvka算法. 算法思想很简单,就是每次贪心的用两个联通块之间最小的边去合并. 复杂度\(O(n \log n)\),然鹅没有Kruskal跑的快,但是 ...

  7. Java thrift服务器和客户端创建实例

    首先环境介绍一下: 1.IntelliJ IDEA 2017.1 2.thrift-0.9.3 相信大家在看我这篇文章的时候已经对thrift通信框架已有所调研,这里就不再赘述了,直接进入正题: &l ...

  8. （四） Keras Dropout和正则化的使用

    视频学习来源 https://www.bilibili.com/video/av40787141?from=search&seid=17003307842787199553 笔记 使用drop ...

  9. Your project path contains non-ASCII characters

    Android studio导入project时报错 non-ASCII characters意味着中文字符报错,解决方法简单有效: 检查项目路径中是否出现中文名,将中文字符修改成英文就可以解决辽~

  10. Django 列的自定义显示

    ModelAdmin 作用:对后台数据表的显示做自定义的设置(如果对django默认的显示模式感到满意则不需要定义modeladmin).我对默认的显示模式永远不满意! 定义modeladmin: f ...