获取最后一个可见div的CSS选择器 [英] A CSS selector to get last visible div

问题描述

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

假设这是HTML布局：

 < div> ;< / div> 
< div>< / div> 
< div>< / div> 
< div style =display：none>< / div> 
< div style =display：none>< / div> 
  

我想选择最后的 div 在给定示例中将被显示（即，不 display：none ），它将是第三个 div
注意，实际页面上的 div 的数量可能不同（即使 display：none

$ p

解决方案

您可以使用JavaScript或jQuery选择和样式化，但是CSS本身不能做到。 p>

例如，如果您在网站上实施了 jQuery ，则可以执行以下操作： / p>

  var last_visible_element = $（'div：visible：last'）; 
  

虽然希望你有一个类/ ID包裹在你选择的div， case你的代码将如下所示：

  var last_visible_element = $（'＃some-wrapper div：visible：last'）; 
  

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

Lets say this is the HTML layout:

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

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).

解决方案

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

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

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

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选择器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！