博主信息
博文 27
粉丝 1
评论 2
访问量 30600
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
jQuery的选择器使用方式——2018年4月4日11时29分
一枝黄花
原创
870人浏览过

今天学习了用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种选择器


批改状态:未批改

老师批语:
本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!
全部评论 文明上网理性发言,请遵守新闻评论服务协议
0条评论
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • 登录PHP中文网,和优秀的人一起学习!
    全站2000+教程免费学