获取最后一个可见 div 的 CSS 选择器

问题描述

一个棘手的 CSS 选择器问题，不知道它是否可能.

A tricky CSS selector question, don't know if it's even possible.

假设这是 HTML 布局:

Lets say this is the HTML layout:

<div></div>
<div></div>  
<div></div>  
<div style="display:none"></div>
<div style="display:none"></div>  

我想选择最后一个 div，它被显示(即不是 display:none)，它将是第三个 div给定的例子.请注意，实际页面上的 div 数量可能不同(甚至是 display:none 的数量).

I want to select the last div, which is displayed (ie. not display:none) which would be the third div in the given example. Mind you, the number of divs on the real page can differ (even the display:none ones).

推荐答案

您可以使用 JavaScript 或 jQuery 选择和设置样式，但仅 CSS 无法做到这一点.

You could select and style this with JavaScript or jQuery, but CSS alone can't do this.

例如，如果您在网站上实现了 jQuery，您可以这样做:

For example, if you have jQuery implemented on the site, you could just do:

var last_visible_element = $('div:visible:last');

虽然希望您将在您选择的 div 周围包含一个类/ID，但在这种情况下，您的代码将如下所示:

Although hopefully you'll have a class/ID wrapped around the divs you're selecting, in which case your code would look like:

var last_visible_element = $('#some-wrapper div:visible:last');

这篇关于获取最后一个可见 div 的 CSS 选择器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！