How can I select an element with a specific inline style?

Suppose there are three elements as below

<div id="tab01">tab01</div>
<div id="tab0开发者_如何学编程2" style="display: none;">tab02</div>
<div id="tab03" style="display: none;">tab03</div>

How can I use jQuery to select an element that don't have an inline style display: none?

Thanks

You can select hidden elements with :hidden, and visible elements with :visible...

$('div:visible');

jsFiddle.

...but if you specifically need elements which don't have display; none set as an inline style, try this...

$('div').filter(function() {
    return $(this).attr('style') == undefined || $(this).attr('style').indexOf('display: none;') == -1
}).

jsFiddle.

...of course, if you are relying on this, you should rethink your problem.

I had a similar question and found this helpful post. The above answer is sufficient but I wanted to do it without using the indexOf method because it didn't seem as intuitive to me.

Here is what I came up with and the associated bin. I left the above answer's code in there to show they both work. Hope this helps as an alternative method. http://jsbin.com/coroxa/1/edit?html,js,output

$('.bottom-drawer').filter(function() {
    //return $(this).attr('style').indexOf('display: block;') === 0;
    return $(this).is("[style*='display: block']") === true;
}).slideToggle(620);