批改状态:未批改
老师批语:
今天学习了用jQuery选择器的几种方式。感觉跟CSS选择器差不多,那时候CSS没有学好,等一下有时间再去看一下之前的视频。这里我用了6种方式来写一个实时热点。
一个实时热点效果预览图

代码如下
<!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种选择器
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号