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. 麒麟子Cocos Creator实用技巧一：如何正确地显示微信头像

    不管是游戏App,还是H5,又或者是微信小游戏.但凡接入了微信登录的应用,都可能需要显示微信头像. 在Cocos Creator中,我们常见的显示方法像下面这样 var headimg = 'http ...

  2. Vue Mixin 与微信小程序 Mixins 应用

    什么是Mixin(混入) Mixin是一种思想,用来实现代码高度可复用性,可以针对属性复制实现代码复用的想法进行一个扩展,就是混入(mixin).混入并不是复制一个完整的对象,而是从多个对象中复制出任 ...

  3. Linux运维企业架构实战系列

    Linux运维企业架构项目实战系列 项目实战1-LNMP的搭建.nginx的ssl加密.权限控制的实现 项目实战2-LVS.nginx实现负载均衡系列 2.1 项目实战2.1-实现基于LVS负载均衡集 ...

  4. entity framework 实现按照距离排序

    在做项目时,经常会遇到“离我最近”这种需求.顾名思义,它需要根据用户的经纬度和事物的经纬度计算距离,然后进行排序,最后分页(当然这些操作要在数据库中进行,否则就变成假分页了). 我们通常可以用sql语 ...

  5. 【Redis】redis各类型数据存储分析

    一.简介和应用 Redis是一个由ANSI C语言编写,性能优秀.支持网络.可持久化的K-K内存数据库,并提供多种语言的API.它常用的类型主要是 String.List.Hash.Set.ZSet ...

  6. Eclipse4JavaEE配置Tomcat运行环境

    如果我们想搭一个网站,我们可以使用Eclipse for JavaEE IDE进行开发. 初次使用需要配置网站的运行环境,可以去Apache官网下载Tomcat 8.5或Tomcat 9的版本 然后打 ...

  7. 设计模式 - 单例模式（Singleton Pattern）

    单例模式 介绍 模式:创建型 意图:保证一个类只有一个实例,并提供一个访问它的全局访问点 解决:一个全局使用的类频繁地创建与销毁 场景: 唯一序列号 web中的计数器 I/O与数据库的连接 …… 实现 ...

  8. 获取url特定参数

    获取通过url拼接的特定参数值: // 获取url指定参数 function getUrlParams(name) { var reg = new RegExp("(^|&)&quo ...

  9. Oracle字符到数值转换错误

    [错误] [问题分析] line 3: 定义 NUM_VAL varchar2(500); line 9: NUM_VAL := 'NUM'+1; NUM_VAL是一个varchar类型的数据,而在数 ...

  10. java：编程比赛中有用的方法整理（一）数组

    我曾经参加过几次编程比赛,但是当时用的是c语言,现在学习了java,打算专攻java组,故以此整理. 数组无论在哪里都必不可少. 一.数组的拷贝: 使用Arrays类的copyOf方法: 1.将一个数 ...