Correction status:Uncorrected
Teacher's comments:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>2.层级选择器</title> <style type="text/css"> .red {color:red;} .green {color:green;} </style> </head> <body> <!-- ul>li{最新电影$$}*10>a{立即播放} --> <ul> <li>最新电影01<a href="">立即播放</a></li> <li>最新电影02<a href="">立即播放</a></li> <li>最新电影03<a href="">立即播放</a></li> <li>最新电影04<a href="">立即播放</a></li> <li>最新电影05<a href="">立即播放</a></li> <li>最新电影06<a href="">立即播放</a></li> <li>最新电影07<a href="">立即播放</a></li> <li>最新电影08<a href="">立即播放</a></li> <li>最新电影09<a href="">立即播放</a></li> <li>最新电影10<a href="">立即播放</a></li> </ul> </body> </html> <script src="../js/jquery-3.3.1.js"></script> <script> $('li a').addClass('green') $('li:first-child').addClass('green') $('li:first').addClass('green') $('li:last-child').css('color','red') $('li:last').css('color','red') $('li:nth-child(6)').addClass('red') //jquery使用eq(i),i从0开始,注意与css中的不一样 $('li:eq(5)').addClass('red') $('*').removeClass() $('li').removeClass() $('li:odd').addClass('red') </script>
点击 "运行实例" 按钮查看在线实例