js進階 10-4 jquery中基礎選擇器有哪些

時間 2020-05-22

標籤進階 jquery 基礎選擇器哪些欄目 JavaScript 简体版

原文原文鏈接

js進階 10-4 jquery中基礎選擇器有哪些

1、總結

一句話總結：

一、羣組選擇器用的符號是什麼？

羣組選擇器，中間是逗號javascript

二、jquery中基礎選擇器有哪些？

5種，類，id，tag，羣組，*css

三、*號選擇器，通用選擇器是什麼？

選擇到全部元素html

2、js進階 10-4 jquery中基礎選擇器有哪些

一、相關知識：JQuery選擇器

原生javaScript中,只能使用getELementById()、getElementByName、getElementByTagName()等幾種有限的方法來獲取元素，JQuery爲咱們提供了大量的選擇器，極大地方便了咱們快速選擇元素來進行各類操做。java

JQuery的選擇器徹底是繼承了css選擇器的風格，你們在學習JQuery選擇器的時候，必定要先聯繫CSS選擇器進行對比記憶。jquery

雖然選擇器不少，可是並不要求你們一會兒全記住。能夠先記住經常使用的幾種，其餘的等到須要的時候查閱下資料。由於這些選擇器，咱們是必須經過真正的開發實踐纔可以真正的熟練掌握學習

基本選擇器

id選擇器：$("#id名")
元素選擇器:$("元素名")
類選擇器:$(".類名")
羣組選擇器:$("選擇器1,選擇器2,.......,選擇器n")
*選擇器:$("*")選擇全部元素

二、實例

 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>