如何用 css 选择相同类名最后一个元素

[落落叶叶无声]

  <ul class="fruits">
    <li class="fruit">1</li>
    <li class="fruit">2</li>
    <li class="">3</li>
    <li class="fruit">4</li>
    <li class="">5</li>
    <!--中间省略若干个class为空或friut的li-->
    ...
    <li class="fruit">n</li>
    <li class="">n+1</li>
  </ul>

如何用 css 选择 含 fruit 类的最后一个元素<li class="fruit">n</li>

[aiweiya520]

貌似只可以通过标签获取最后一个元素 不能通过class获取最后一个元素

[极客诗人]

last-child

[忘记呼吸]

$("li:last").hasClass("fruit")

[qq_25376897]

CSS的话不太好写，用jQuery比较简单

var aa = $("li[class=fruit]:last");
console.log(aa.text()); //n

[zhongxiucheng]

从纯粹的CSS角度来看，这个问题不太容易解决，貌似可以使用规则.fruit:last-child来进行选择，但是如果最后确定的.fruit元素不是最后一个子元素其实是没有效果的，相对可以行的办法是动用脚本，使用jquery选择器，直接使用$(".fruit:last-child").addClass("fruit-lass");添加完成之后，可以针对.fruit-last类，展开业务，但是这种方法有一个问题，如果li元素是变化需要额外的逻辑进行支持

[qq_25073223]

我觉得这篇文章所对应的内容是你想要的东西 CSS3 伪类:last-child 选择器简介说明

[前端小歌谣]

last child

[fionwon]

学习了！！！！