jQuery多项选择器模式:

$("selector1,selector2,selectorN");

将每一个选择器匹配到的元素合并后一起返回,可以指定任意多个选择器,并将匹配到的元素合并到一个结果内。

示例代码:

<!DOCTYPE html>
<html>
<head lang="zh-CN">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
<title>多项选择器</title>
<style></style>
</head> <body>
<div id="one" class="number">1</div>
<div id="two" class="string">2glass</div>
<div id="three" class="string">3monkey</div>
<div id="four" class="number">4</div>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
//此处填写代码
var a=$('#one,.string,div');
console.log(a); });
</script>
</body> </html>

控制台打印结果:

id选择器“#one”和clas选择器“.string”所选择的元素包含在元素选择器“div”内,但是jQuery多项选择器的最终结果是所有元素集合按照html文档流中的顺序进行排列。

可以手动试试选择器的代码顺序更改后,最终元素集合的顺序是否改变?

var a=$('.string,#one,div');
console.log(a);

jQuery多项选择器的更多相关文章

  1. js进阶 11-19 jquery如何查找选择器的第一个父亲元素和第一个定位的父元素

    js进阶 11-19 jquery如何查找选择器的第一个父亲元素和第一个定位的父元素 一.总结 一句话总结:closest()方法获得匹配选择器的第一个祖先元素,从当前元素开始沿 DOM 树向上.of ...

  2. js进阶 11-18 jquery中操作选择器的方法有哪些

    js进阶 11-18 jquery中操作选择器的方法有哪些 一.总结 一句话总结:add().addBack().end() 1.add()方法是干嘛的,举一例? 将add()方法后选择器选择的jqu ...

  3. jQuery九大选择器和jQuery对ajax的支持

    一.jQuery九大选择器 1)基本选择器: <body> <div id="div1ID">div1</div> <div id=&qu ...

  4. jQuery基础之选择器

    摘自:http://www.cnblogs.com/webmoon/p/3169360.html jQuery基础之选择器 选择器是jQuery的根基,在jQuery中,对事件处理.遍历DOM和Aja ...

  5. jQuery 简单过滤选择器

    <!DOCTYPE HTML> <html> <head> <title> 使用jQuery基本过滤选择器 </title> <scr ...

  6. JQuery:JQuery语法、选择器、事件处理

    JQuery语法:   通过 jQuery,您可以选取(查询,query) HTML 元素,并对它们执行"操作"(actions). 一.语法:jQuery 语法是通过选取 HTM ...

  7. 23、jQuery九类选择器/jQuery常用Method-API/jQuery常用Event-API

      1)掌握jQuery九类选择器及应用 2)掌握jQuery常用Method-API 3)掌握jQuery常用Event-API 一)jQuery九类选择器[参见jQueryAPI.chm手册] 目 ...

  8. jQuery基础知识--选择器与效果

    $(this).hide()-----隐藏当前元素 $("p").hide()------隐藏所有段落 $(".test").hide()--隐藏所有class ...

  9. jQuery的筛选选择器

    基本筛选选择器 很多时候我们不能直接通过基本选择器与层级选择器找到我们想要的元素,为此jQuery提供了一系列的筛选选择器用来更快捷的找到所需的DOM元素.筛选选择器很多都不是CSS的规范,而是jQu ...

随机推荐

  1. JS数组添加元素的三种方式

    1.push() 结尾添加 数组.push(元素) 参数 描述 newelement1 必需.要添加到数组的第一个元素. newelement2 可选.要添加到数组的第二个元素. newelement ...

  2. xtu summer individual 5 F - Post Office

    Post Office Time Limit: 1000ms Memory Limit: 10000KB This problem will be judged on PKU. Original ID ...

  3. 编程数学(A-1)-(B-1)-一个数的负次方怎么算

    一个数的负几次方就是这个数的几次方的倒数.当这个数是正整数时,也就是说一个数的负n次方就是这个数的n次方分之一.例如: 2的-2次方=2的2次方分之1=4分之13的-2次方=3的2次方分之1=9分之1 ...

  4. [luoguP1896] [SCOI2005]互不侵犯King(状压DP)

    传送门 先预处理出来一行中放置国王的所有情况和每种情况所用的国王个数. f[i][j][k]表示前i行放j个国王且最后一行的状态为k的方案数 状压DP即可 #include <cstdio> ...

  5. [codevs4655] 序列终结者(Splay)

    传送门 支持操作: 1.区间加 2.区间翻转 3.区间求最大值 splay模板 注意:update 里更新 max 时需要取 3 个值的 Max 别忘了各种边界讨论 ——代码 #include < ...

  6. memcache 原理 & 监测 & 查看状态 & stats & 结构

    Mencache内存存储方式:slab/LRU,采用预先申请固定大小的内存页(slab/page),然后再把内存分成多个块(chunk) 先放一张从网上找到的memcache内存结构图,觉得非常的赞:

  7. hdu - 1104 Remainder (bfs + 数论)

    http://acm.hdu.edu.cn/showproblem.php?pid=1104 注意这里定义的取模运算和计算机的%是不一样的,这里的取模只会得到非负数. 而%可以得到正数和负数. 所以需 ...

  8. DTRACE简介之完结篇3

    https://blogs.oracle.com/swan/entry/dtrace%E7%AE%80%E4%BB%8B_3 DTRACE简介之完结篇 By samwan on 四月 13, 2007 ...

  9. CSS头像右上角的讨厌红点

    就是这个讨厌的红点,如图: 说明: 1.主要用到position定位: 2.使用border-radius画圆角: 源码: <!DOCTYPE html> <html> < ...

  10. 使用Java快速开发博客、官网等偏内容型网站-IDEA篇-MCMS

    分享快乐 由于官网提供的是eclipse的教学视频,清晰度感人,看得我就一个纳闷,反复的看,反复检查,就是不行,然后天真的寻觅帮助,反复查看文档依旧凉凉.最后放弃,转战idea.特此篇,希望能帮助到各 ...