項目のリストからのみ（表示：ブロック）要素を選択します。Jquery

Question

メニューを作成しています.Jqueryから返された要素のリストから1つの特定の要素を選択する必要があります。

iは、コンソール上で実行：

$("[type='subMenu']") 

これは4つのマッチングサブメニュー要素を返します。

<div type="subMenu" style="display:block"> 
<div type="subMenu" style="display:none"> 
<div type="subMenu" style="display:none"> 

は今、私は

$("[type='subMenu']").css('display') == 'block' 

を試みたが、これは出力としてfalseを与えるdisplay:block

を持つ唯一の要素を選択する必要があります。

と

$("[type='subMenu']").css('display') 

これは、あなたは、フィルタまたは擬似クラスを使用none

Answer 1

その他を与える

console.log($("[type='subMenu']:visible")). 

をすでにjQueryの:visibleセレクタを指摘しています。 JQuery API documentationで指摘したようにしかし、いくつかのパフォーマンスの問題は、それであります。

追加メモ：

• は:visibleは、jQueryの延長ではなく、CSSの仕様の一部であるクエリを使用しているので:visibleは、ネイティブDOM querySelectorAll()メソッドによって提供されるパフォーマンスの向上を利用できません。 :visibleを使用して要素を選択するときに最高のパフォーマンスを得るには、まず純粋なCSSセレクタを使用して要素を選択し、次に.filter(":visible")を使用します。
• このセレクタを使用すると、パフォーマンスが影響を受ける可能性があります。ブラウザが表示を決定する前にページを再レンダリングする可能性があります。たとえば、クラスを使用して、他のメソッドを使用して要素の可視性を追跡すると、より優れたパフォーマンスが得られます。

これらの問題を回避したい場合は、代わりにネイティブCSSセレクタを使用できます。（Iドンを

document.querySelectorAll("[type=subMenu][style*=display\\:block]"); 

私はjQueryので同等のものを信じて：あなたは一度に複数の要素を選択する必要がある場合は、

document.querySelector("[type=subMenu][style*=display\\:block]"); 

をまたは：昔ながら」通常のJavaScriptでは、これはあなたのためにトリックを行うだろうこれまでに、これらのタグにインラインで設定されるだけでスタイルがdisplayであれば、あなたはから*を省略することができ

$("[type=subMenu][style*=display\\:block]"); 

：「Tは次のようになり、両方のために）それを使用します属性セレクタ。

Answer 2

として出力することができます与えています。

$("[type='subMenu']").filter(function(){ 
    this.style.display == 'block'; 
}); 

Answer 3

このお試しください：それは、すべての可視要素に