document.querySelector 有多个类

document.querySelector 方法用于返回文档中匹配指定 CSS 选择器的第一个元素。如果要查询具有多个类的元素,可以将它们作为一个字符串传递给 querySelector,并使用 . 符号将它们隔开。

例如,如果你想要选择拥有 class1 和 class2 类的元素,你可以这样做:

 
var element = document.querySelector('.class1.class2');

这里,.class1.class2 是 CSS 选择器,它会选择所有同时拥有 class1 和 class2 类的元素。注意,在这里没有空格,因为 . 是用来分隔类名的。

如果你想要选择拥有任何一个指定类的元素,可以使用 , 符号分隔类名:

 
var element = document.querySelector('.class1, .class2');

这将返回文档中具有 class1 或 class2 类的第一个元素。如果你想要选择拥有所有指定类的元素,但类名的顺序并不重要,你可以使用 querySelectorAll 方法:

 
var elements = document.querySelectorAll('.class1.class2');

这将返回文档中同时拥有 class1 和 class2 类的所有元素。

document.querySelector 有多个类 的情况的更多相关文章

  1. document.getElementById和document.querySelector的区别

    zepto中的$(".111")出错,jQuery中$(".111")不出错的原因: zepto用document.querySelector实现,jQuery ...

  2. 正确地缩写 document.querySelector

    北京的夕阳,伴随淡淡的霾殇.从写字楼望去,光线是那么昏黄.没有孤雁,也没有霞光,遥想当年,还是 jQuery 独霸一方.那时的我们,写程序都习惯了使用 $,至少在对美元符号的喜爱上,与 PHP 达成了 ...

  3. 实现兼容document.querySelector的方法

    var querySelector = function(selector) { //TODO 先简单兼容,后续继续扩展: var element = null; if(document.queryS ...

  4. document.querySelector和querySelectorAll方法

    querySelector和querySelectorAll是W3C提供的新的查询接口,其主要特点如下: 1.querySelector只返回匹配的第一个元素,如果没有匹配项,返回null.  2.q ...

  5. 2013 Visual Studio Magazine读者选择奖界面框架类获奖情况

    2013 Visual Studio Magazine读者选择奖已经正式揭晓了!据了解,截至今年此奖项已经评选了21次,非常值得.NET开发人员信赖和参考.此次评选共有400多个产品角逐28个分类的奖 ...

  6. document.querySelector获取不到html标签对象实例的原因

    官方给出的HTML中的ID的命名规范: 1.必须以字母 A-Z 或 a-z 开头2.其后的字符:字母(A-Za-z).数字(0-9).连字符("-").下划线("_&qu ...

  7. javascript之 原生document.querySelector和querySelectorAll方法

    querySelector和querySelectorAll是W3C提供的新的查询接口,其主要特点如下: 1.querySelector只返回匹配的第一个元素,如果没有匹配项,返回null.  2.q ...

  8. document.querySelector()和document.querySelectorAll()

    HTML5向Web API新引入了 document.querySelector()和document.querySelectorAll()两个方法,都可以接收三种类型的参数:id(#),class( ...

  9. document.querySelector()与document.querySelectorAll()

      document.querySelector()与document.querySelectorAll() CreationTime--2018年7月1日10点49分 Author:Marydon ...

  10. JAVA之中出现无法加载主类的情况解决方法

    j今天打代码的时候出现了无法加载主类的情况,我就收集了一些,java无法加载主类的方法 ava无法加载主类解决办法 今天启动项目,又遇到找不到或无法加载主类的情况,清除项目后无法编译,class文件下 ...

随机推荐

  1. 5道大厂的JAVA经典面试题

    前言 本来想着给自己放松一下,刷刷博客,慕然回首,Java的四种引用,强弱软虚?泛型常用特点?Java创建对象有几种方式? 有没有可能两个不相等的对象有相同的hashcode?深拷贝和浅拷贝的区别是什 ...

  2. CSPS2024题目总结

    T1 决斗 签到题,考场上10min就做出来了. 我的方法是排序之后贪心打怪,就是用尽量小的怪去打现在场上最小的怪.用一个同侧双指针实现. \(O(nlogn)\). 另一种方法注意到了值域很小,可以 ...

  3. yum 安装软件出现 gpg keys 相关问题

    问题:Public key for *.rpm is not installed 系统中没有能验证该 RPM 数字签名的公钥 安装现有的 gpg 公钥,在 /etc/pki/rpm-gpg/ 下,可以 ...

  4. dephi winspy Demo

    在spy+中未找到这样的功能 有个隐藏窗口的进程,相让窗口显示出来,虽然可以找到进程ID,然后再逐步找到主窗口句柄,但又没句柄发各种消息的软件. 计得以前有个窗口精灵之类的,网上找了很多,要么没有此功 ...

  5. po文件如何转为excel

    其实.po文件是一种翻译文件格式,类似于 key - value的列表 可以理解为两列,由于我们想把这个po数据读出来放入 excel.因为大部分人看不懂po文件的.虽然我们可以借助工具 poedit ...

  6. PHP扩展之Yaconf

    这个是继鸟哥出品的yaf,yar 之后的又一个好用的工具.  Yaconf配置管理工具 具体可以看鸟哥的文档: https://www.laruence.com/2015/06/12/3051.htm ...

  7. elastic 7.15 集群搭建

    准备三台ES 7.15 关于系统配可以参考之前的文章. https://www.cnblogs.com/yg_zhang/p/10214196.html 这里写一下 的集群配置.这里和之前配置有所不同 ...

  8. C语言离散化

    C语言离散化 最近看到STL就不想用, 于是写个C语言离散化, 居然能过主席树板子, 就写个博客介绍一下. qsort和bsearch都在<stdlib.h>或<cstdlib> ...

  9. whisper v3 finetune 中文乱码问题的解决方案

    最近学习了一下whisper的微调,主要是参考了github上的夜雨飘零大神项目.但是在操作中遇到了微调中文的时候出现了乱码的情况.以下是我这边对于微调过程中中文出现乱码情况的解决方案. 出现情况如下 ...

  10. 全面解读TaurusDB透明压缩特性,降低数据库使用成本

    本文分享自华为云社区<[华为云MySQL技术专栏]TaurusDB透明压缩>,作者: GaussDB 数据库. 背景介绍 某一部分特定比例的客户群体,对数据库的读写性能要求并不高.相比之下 ...