<!DOCTYPE html>

<html lang="en">

<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="杨欣">

    <title>获取页面所有的checkbox</title>

</head>

<body>

    <input type="checkbox" name="box1" id="box1">box1

    <input type="checkbox" name="box2" id="box2">box2

    <input type="checkbox" name="box3" id="box3">box3

    <input type="checkbox" name="box4" id="box4">box4

    <input type="checkbox" name="box5" id="box5">box5

    <input type="checkbox" name="box6" id="box6">box6

    <script>

        var inputs = document.getElementsByTagName("input");

        var boxs = [];

        for (let i = 0; i < inputs.length; i++) {

            if (inputs[i].type == "checkbox") {

                boxs.push(inputs[i])

            }

        }

       console.log(boxs)

    </script>

</body>

</html>

　　

原生js获取页面所有的checkbox的更多相关文章

  1. 原生js获取页面中所有checkbox

    var inputs = document.getElementsByTagName("input");//获取所有的input标签对象 var checkboxArray = [ ...

  2. 原生js获取到页面上所有的checkbox

    <!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" ...

  3. 原生js获取鼠标坐标方法全面讲解-zmq

    原生js获取鼠标坐标方法全面讲解:clientX/Y,pageX/Y,offsetX/Y,layerX/Y,screenX/Y 一.关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:eve ...

  4. 原生js获取宽高与jquery获取宽高的方法的关系

    说明:1.因为获取高度的情况跟获取宽度的情况一样,所以以下只说获取宽度的情况.  2.以下所说的所有方法与属性所返回的值都是不带单位的.  3.为了方便说明,以下情况采用缩写表示:  obj -> ...

  5. 兼容各版本浏览器,封装原生Js获取ClassName

    web前端开发工作中常常会用到获取元素的className,用jQuery的$(".class")方法也可以获取className,但是有时候牵扯到数据而影响的加载顺序的原因会获取 ...

  6. jquery、js获取页面高度宽度等

    jquery获取页面高度宽度 //获取浏览器显示区域(可视区域)的高度 : $(window).height(); //获取浏览器显示区域(可视区域)的宽度 : $(window).width(); ...

  7. 原生JS获取DOM 节点到浏览器顶部的距离或者左侧的距离

    关于js获取dom 节点到浏览器顶/左部的距离,Jquery里面有封装好的offset().top/offset().left,只到父级的顶/左部距离position().top/position() ...

  8. 原生JS的使用，包括jquery和原生JS获取节点、jquery和原生JS修改属性的比较

    一.前言 相比于JS这条直达终点.满是荆棘的小路,jquery无疑是康庄大道了,足够的简洁.易用给了它辉煌的地位.然而,毕竟是绕着道的插件,当小路走着走着变成大路的时候,曾经的大路也就失去了他自身的优 ...

  9. JS获取页面数据执行Ajax请求

    下面这个例子展示了如何使用js获取页面中元素的值,并且将这些值作为参数执行Ajax请求. $("#submit-task").bind("click", fun ...

随机推荐

  1. UNP——第二章，端口号，套接字对，TCP,UDP输出

    1.端口号 端口号用于区分使用相同协议的进程. TCP69 与 UDP69 是不同的. 端口号范围 0 - 65535, 其中 0- 1023 是保留端口. 2.套接字对 TCP服务通过套接字对,唯一 ...

  2. 02Java写一个hello world

    新建一个.text文件 输入并保存如下代码: public class HelloWorld{ public static void main(String[] args){ System.out.p ...

  3. Python_DOM

    Dom简介:Js通过标签筛选让html多文件联动 1.找到标签 获取单个元素 docum ent.getElemrntByID('i1') 获取多个元素(列表)document.getElemrnts ...

  4. [LeetCode题解]160. 相交链表 | 双指针 + 哈希表

    方法一:双指针 解题思路 假设链表存在相交时,headA 的长度为 a + c,headB 的长度为 b + c.如果把 headA 连上 headB,headB 连上 headB 的话,当遍历这两个 ...

  5. a标签禁用

    a标签禁用可以使用CSS3的特性来控制 <a class="disabled">我是a标签</a> a.disabled { pointer-events: ...

  6. Centos快速安装Docke

    预备 删除旧docker # 删除旧docker $ sudo yum remove docker \ docker-client \ docker-client-latest \ docker-co ...

  7. 宕机了，Redis数据丢了怎么办？

    持续原创输出,点击上方蓝字关注我 目录 前言 什么是AOF? 三种写回策略 日志文件太大怎么办? AOF重写会阻塞主线程吗? AOF的缺点 总结 什么是RDB? 给哪些数据做快照? 快照时能够修改数据 ...

  8. java开发两年，这些线程知识你都不知道，你怎么涨薪？

    前言 什么是线程:程序中负责执行的哪个东东就叫做线程(执行路线,进程内部的执行序列),或者说是进程的子任务. Java中实现多线程有几种方法 继承Thread类: 实现Runnable接口: 实现Ca ...

  9. 你也想当流量UP主？那就点开看看吧！

    2009年6月份,哔哩哔哩(B站)在一众期待中诞生,它汇聚了天南海北当时小众的二次元同好,它也存在诸多不足,大家亲切地叫它"小破站". 而如今,它成长为一棵枝繁叶茂的参天大树,成为 ...

  10. CorelDRAW文件损坏的几种解决方法

    以前做好的CorelDRAW文件突然打不开了,或者是死机.非法操作等原因造成CorelDRAW文件损坏,有时打开源文件发现一片空白,源文件保存损坏无法打开怎么办?此时不要着急,你可以试试以下几种办法帮 ...