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. jquery快速入门（四）

    jQuery 遍历 向上遍历 DOM 树 parent() parent() 方法返回被选元素的直接父元素.该方法只会向上一级对 DOM 树进行遍历. parents() parents() 方法返回 ...

  2. 4.2WebHost配置「深入浅出ASP.NET Core系列」

    希望给你3-5分钟的碎片化学习,可能是坐地铁.等公交,积少成多,水滴石穿,谢谢关注. WebHost配置 覆盖配置文件和修改启动URL 覆盖配置文件和修改启动URL是经常使用的地方,覆盖配置文件可以自 ...

  3. angr学习

    0.资料 几个主要的网站 angr的github:https://github.com/angr angr的document:https://docs.angr.io/ angr的api:https: ...

  4. pm2通过配置文件部署nodejs代码到服务器

    一.pm2文档地址: http://pm2.keymetrics.io/ 二.在本地项目下新建ecosystem.config.js文件,并且推送到远端(记得node_modules这个文件夹也得推送 ...

  5. 简单多播委托Demo

    namespace ConsoleApp4 { class Program { static void Main(string[] args) { Mum mum = new Mum(); Dad d ...

  6. C# 连接/查询Jira

    查询jira数据,如果是前端,可以按照如下格式直接访问,获取数据 http://jira.company.com/rest/api/2/search?jql=project = REM AND res ...

  7. java的设计模式 - Builder模式

    Builder 模式的目的? 构造对象的方式过于复杂,不如将之抽离出来.比如,构造器参数过多 这样说也有点抽象,举个例子吧. 举个例子 比如 非常热门的消息队列RabbitMQ 的 AMQP.Basi ...

  8. HTML文档命名规则

    HTML文档是展示Web前段开发工程师成果的最好表示方式,为了便于文档规范化管理,在编写HTML文档时,必须遵循HTML文件命名规则. HTML文档命名规则如下: (1)文档的扩展名为htm或者htm ...

  9. 学习笔记—JVM

    JVM结构 JVM总体结构图 类加载子系统与方法区: 类加载子系统负责从文件系统和网络中加载Class信息,加载的类信息存放于一块称为方法区的内存空间. 除了类信息外,方法区中还可能会存放运行时常量池 ...

  10. servlet与jsp篇（一）$.ajax交互

    servlet其实是利用java类编写的服务器端应用程序,他的生命周期可以分为三个阶段:初始化阶段.运行阶段和消亡阶段; jsp页面实质上是一个HTML页面,但他包含了用户产生动态网页内容的java代 ...