码迷,mamicode.com
首页 > 其他好文 > 详细

querySelector

时间:2018-09-08 11:47:37      阅读:148      评论:0      收藏:0      [点我收藏+]

标签:通过   选择   round   css选择器   select   code   red   ack   第一个   

querySelector



querySelector(css选择器)
通过css选择器去获取一个元素
它获取到的只有一个元素,如果说有重复的,那它只取第一个


 

querySelectorAll(css的选择器)
通过css选择器获取到一组元素
它获取到的也是一组元素,它也是一个类数组


 

querySelector例:

 

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="UTF-8">
 5         <title></title>
 6         <script>
 7         
18             window.onload=function(){
19                 var red=document.querySelector(#color li:first-child);
20                     red.style.background=red;
21                 var ul=document.querySelector(.color2);
22                     ul.style.background=yellow;
23             };
24         </script>
25     </head>
26 
27     <body>
28         <ul id="color">
29             <li>red</li>
30             <li class="green">green</li>
31             <li>blue</li>
32             <li>yellow</li>
33             <li>pink</li>
34         </ul>
35         <ul class="color2">
36             <li>red</li>
37             <li class="green">green</li>
38             <li>blue</li>
39             <li>yellow</li>
40             <li>pink</li>
41         </ul>
42     </body>
43 
44 </html>

 

querySelector

标签:通过   选择   round   css选择器   select   code   red   ack   第一个   

原文地址:https://www.cnblogs.com/zzq-229/p/9608039.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!