<!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. HDU100题简要题解（2080~2089）

    //2089之前忘做了,周二C语言课上做,至于2086,写题解的时候突然发现之前的做法是错的,新的解法交上去CE,等周二再弄吧,其余题目暂时可以放心 HDU2080 夹角有多大II 题目链接 Prob ...

  2. C#设计模式——代理模式（Proxy Pattern）

    引言 在我们的生活中,经常会遇到需要什么东西,但是自己又不是很方便或者对方不是很方便,则就需要中间的一个代理人去解决.例如代购.在软件开发中,也会遇到这样的问题.有些对象有时候会由于网络或其他的障碍, ...

  3. YH高校集中用电管理网上查询系统POST注入漏洞

    1.burpsuite 抓包保存为1.txt POST /apartsearch.asp HTTP/1.1 Host: 2*0.86.2**.69 User-Agent: Mozilla/5.0 (W ...

  4. Python：安装Bio库不成功，出现ModuleNotFoundError: No module named 'Bio'

    Bio库的安装并不是pip install bio,而是biopython. ./anaconda3/bin/pip3 install biopython -i https://pypi.douban ...

  5. 应聘阿里，字节跳动，美团必须掌握的Spring IOC与工厂模式

    Spring IOC与工厂模式 PS:本文内容较为硬核,需要对java的面向对象.反射.类加载器.泛型.properties.XML等基础知识有较深理解. (一)简单介绍 在讲Spring IOC之前 ...

  6. 阿里面试官：小伙子，你给我说一下JVM对象创建与内存分配机制吧

    内存分配机制   逐步分析 类加载检查: 虚拟机遇到一条new指令(new关键字.对象的克隆.对象的序列化等)时,会先去检查这个指令的参数在常量池中定位到一个类的符号引用,并且这个符号引用代表的类是否 ...

  7. CorelDRAW：油漆滚轮及LOGO设计

    小马坐在电脑前,看着自己画的油漆滚轮Logo,既生气又无奈.为了这个油漆Logo,小马用了四.五个不同的设计软件,也画了不下10个图案,就没有一个满意的."明天就要交稿了,现在都11点多了, ...

  8. 从执行上下文角度重新理解.NET(Core)的多线程编程[2]：同步上下文

    一般情况下,我们可以将某项操作分发给任意线程来执行,但有的操作确实对于执行的线程是有要求的,最为典型的场景就是:GUI针对UI元素的操作必须在UI主线程中执行.将指定的操作分发给指定线程进行执行的需求 ...

  9. Jinja2语法自动补全配置

    Jinja2语法自动补全配置 说明 在使用Pycharm社区版进行Web开发时,Jiaja2的语法是不会自动提示补全的,为了提高开发效率,需要根据个人习惯进行一些常用语法的自动补全配置,具体如下. 配 ...

  10. Mybatis【1】-- 第一个Mybatis程序

    1.框架是什么 框架(Framework)是整个或部分系统的可重用设计,表现为一组抽象构件及构件实例间交互的方法;另一种定义认为,框架是可被应用开发者定制的应用骨架.前者是从应用方面而后者是从目的方面 ...