js进阶 10-4 jquery中基础选择器有哪些

一、总结

一句话总结：

1、群组选择器用的符号是什么？

群组选择器，中间是逗号

2、jquery中基础选择器有哪些？

5种，类，id，tag，群组，*

3、*号选择器，通用选择器是什么？

选择到所有元素

二、js进阶 10-4 jquery中基础选择器有哪些

1、相关知识：JQuery选择器

原生javaScript中,只能使用getELementById()、getElementByName、getElementByTagName()等几种有限的方法来获取元素，JQuery为我们提供了大量的选择器，极大地方便了我们快速选择元素来进行各种操作。

JQuery的选择器完全是继承了css选择器的风格，大家在学习JQuery选择器的时候，一定要先联系CSS选择器进行对比记忆。

虽然选择器很多，但是并不要求大家一下子全记住。可以先记住常用的几种，其他的等到需要的时候查阅下资料。因为这些选择器，我们是必须通过真正的开发实践才能够真正的熟练掌握

基本选择器
  • id选择器：$("#id名")
  • 元素选择器:$("元素名")
  • 类选择器:$(".类名")
  • 群组选择器:$("选择器1,选择器2,.......,选择器n")
  • *选择器:$("*")选择所有元素

2、实例

 <!DOCTYPE html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>演示文档</title>

     <script src="jquery-3.1.1.min.js"></script>

     <script src="ktys4.js"></script>

     <style type="text/css">

 /*        h4{color: red}

         #p1{color: green}

         .xzq{color: blue}

         #p1,.xzq{font-size: 12px}*/

     </style>

 </head>

 <body>

     <h4>基本选择器</h4>

     <p id="p1">所谓的基本选择器，指的是在jQuery中使用最频繁的选择器。在jQuery中，基本选择器共有5种：</p>

     <ul>

         <li class="xzq">元素选择器</li>

         <li class="xzq">id选择器</li>

         <li class="xzq">class选择器</li>

         <li class="xzq">群组选择器</li>

         <li class="xzq">*选择器</li>

     </ul>

     <script type="text/javascript">

         // $('h4').css('color','red')

         // $('#p1').css('color','green')

         // $('.xzq').css('color','blue')

         // $('#p1,.xzq').css('font-size','12px')

     </script>

 </body>

 </html>

js进阶 10-4 jquery中基础选择器有哪些的更多相关文章

  1. js进阶 11-4/5 jquery中css的类的操作有哪些

    js进阶 11-4/5  jquery中css的类的操作有哪些 一.总结 一句话总结:jquery中css的类的操作有增删切三种. 1.jquery中css的类的操作有哪些? 增删切三种 addCla ...

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

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

  3. js 进阶 10 js选择器大全

    js 进阶 10 js选择器大全 一.总结 一句话总结:和css选择器很像 二.JQuery选择器 原生javaScript中,只能使用getELementById().getElementByNam ...

  4. js进阶 13-11/12 jquery如何实现折叠导航

    js进阶 13-11/12 jquery如何实现折叠导航 一.总结 一句话总结:还是用的slideToggle滑动效果,并且这一个展开时,所有兄弟都关闭. 1.文字缩进怎么设置? 感觉设置margin ...

  5. js进阶课程 12-9 jquery的事件对象event的方法有哪些？

    js进阶课程 12-9 jquery的事件对象event的方法有哪些? 一.总结 一句话总结:三组六个,阻止默认事件一组,阻止冒泡一组,阻止冒泡和剩余事件一组. 1.事件的默认动作指什么? 比如点a标 ...

  6. js进阶 10-7 简单的伪类选择器可以干什么

    js进阶 10-7 简单的伪类选择器可以干什么 一.总结 一句话总结:伪类选择器是冒号. 1.学而不用,有什么用? 多用啊,在项目中多用 2.简单的伪类选择器可以干什么? 除某元素以外,某元素的一切索 ...

  7. jQuery中的选择器《思维导图》

    学习jQuery的课程中,我对jQuery中的选择器有了更深的认识,它的简洁写法,完美的兼容性,可靠的处理机制,都让我们省了很多事, 下面是我在学习过程中对jQuery选择器写的思维导图(全屏查看:& ...

  8. js进阶---12-11、jquery如何给动态创建出来的元素绑定事件

    js进阶---12-11.jquery如何给动态创建出来的元素绑定事件 一.总结 一句话总结:通过事件委托的方式,通过on方法 1.on方法在事件绑定的时候,data方式带额外参数时,字符串参数和其它 ...

  9. js进阶---12-10、jquery绑定事件和解绑事件是什么

    js进阶---12-10.jquery绑定事件和解绑事件是什么 一.总结 一句话总结:on和off. 1.jquery如何给元素绑定事件? on方法 22 $('#btn1').on('click', ...

随机推荐

  1. 移动mm 话费支付接入过程（ane）

    下面记录移动mm 话费支付接入的过程 1.强联网.弱联网差别.sdk是否有区分?用户体验部分由什么不同和差异? 差别在于强联网是网络通道(wifi/gprs/3g),弱联网是走短信通道,用户层面差异在 ...

  2. elasticsearch cluster 详解

    上一篇通过clusterservice对cluster做了一个简单的概述, 应该能够给大家一个初步认识.本篇将对cluster的代码组成进行详细分析,力求能够对cluster做一个更清晰的描述.clu ...

  3. Vue 拖拽组件 vuedraggable 和 awe-dnd

    vuedraggable:https://www.npmjs.com/package/vuedraggable awe-dnd:https://www.npmjs.com/package/awe-dn ...

  4. 洛谷 P2368 EXCEEDED WARNING B

    P2368 EXCEEDED WARNING B 题目背景 SGU 107 题目描述 求有多少个平方后末尾为987654321的n位数 输入输出格式 输入格式: 整数n 输出格式: 答案,即[b]“平 ...

  5. [D3] Build an Area Chart with D3 v4

    Similar to line charts, area charts are great for displaying temporal data. Whether you’re displayin ...

  6. 芯片TPS70925

    TPS70925电源芯片 从上图中可以看出EN脚是使能脚,并且是高使能,低失能. tps70925的典型用法: 这个芯片有很多封装,我们用的是第一个:

  7. ES6的学习之路(基础知识总结)

    1. 变量声明 1).let 1)使用let定义的变量不会进行"变量提升" console.log(a);//Uncaught ReferenceError: a is not d ...

  8. JS学习笔记 - cookie设置、读取、删除

    <script> // 设置cookie function setCookie(name, value, iDay) { var oDate = new Date(); oDate.set ...

  9. HDU 1166 敌兵布阵 树状数组||线段树

    http://acm.hdu.edu.cn/showproblem.php?pid=1166 题目大意: 给定n个数的区间N<=50000,还有Q个询问(Q<=40000)求区间和. 每个 ...

  10. java三大特性：封装、继承、多态

    Java三大特性之封装   一.定义 封装性指的是将对象的状态信息隐藏在对象内部,不允许外部程序直接访问对象内部的信息,而是通过该类所提供的方法来实现对内部信息的操作和访问. 二.使用封装的好处: 1 ...