微信扫一扫打赏支持

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

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、实例

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>演示文档</title>
 6     <script src="jquery-3.1.1.min.js"></script>
 7     <script src="ktys4.js"></script>
 8     <style type="text/css">
 9 /*        h4{color: red}
10         #p1{color: green}
11         .xzq{color: blue}
12         #p1,.xzq{font-size: 12px}*/
13     </style>
14 </head>
15 <body>
16     <h4>基本选择器</h4>
17     <p id="p1">所谓的基本选择器,指的是在jQuery中使用最频繁的选择器。在jQuery中,基本选择器共有5种:</p>
18     <ul>
19         <li class="xzq">元素选择器</li>
20         <li class="xzq">id选择器</li>
21         <li class="xzq">class选择器</li>
22         <li class="xzq">群组选择器</li>
23         <li class="xzq">*选择器</li>
24     </ul>
25     <script type="text/javascript">
26         // $('h4').css('color','red')
27         // $('#p1').css('color','green')
28         // $('.xzq').css('color','blue')
29         // $('#p1,.xzq').css('font-size','12px')
30     </script>
31 </body>
32 </html>

 

posted @ 2018-06-13 10:52  范仁义  阅读(444)  评论(0编辑  收藏  举报