Blogger Information
Blog 27
fans 1
comment 2
visits 25268
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
jQuery的选择器使用方式——2018年4月4日11时29分
一枝黄花
Original
701 people have browsed it

今天学习了用jQuery选择器的几种方式。感觉跟CSS选择器差不多,那时候CSS没有学好,等一下有时间再去看一下之前的视频。这里我用了6种方式来写一个实时热点。

一个实时热点效果预览图

QQ截图20180404113246.png

代码如下

实例

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>jQuery的选择器方法</title>
  <body>
  <div>
  <ul>
  <li>1. 美国发建议征税清单   <a href=''>热度 44988</a></li>
  <li>2. 美公布加征关税清单   <a href=''>热度 43537</a></li>
	<li>3. 广州民房凌晨失火   <a href=''>热度 42992</a></li>
  <li>4. 女生发掀裙自拍照   <a href=''>热度 42015</a></li>
  <li>5. 美国优兔总部枪击案   <a href=''>热度 40266</a></li>
  <li>6. 外逃17年的女红通   <a href=''> 热度 38575</a></li>
  <li>7. 中国有王牌对贸易战   <a href=''>热度 37687</a></li>
  <li>8. 身份证新规   <a href=''>热度 36163</a></li>
  </ul>
  </div>
  </body>
  </html>
  <script type="text/javascript" src="../js/s/jquery-3.3.1.js"></script>
  <script type="text/javascript">
   $('UL').find('a').css('text-decoration','none')
   $('a').get(0).style.color = 'red'
   $('li').last().css('font-size','30px')
   $('li').eq(3).css('background-color','lightgreen')
   $('li').eq(4).next().css('background-color','lightskyblue')
   $('li').eq(2).next().css('font-size','25px')
   $('li').css('color','deeppink')
   $('li').slice(7).css('background-color','lightgreen')
  </script>

运行实例 »

点击 "运行实例" 按钮查看在线实例

总结:这里我用到了6种选择器


Correction status:Uncorrected

Teacher's comments:
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments