CSSまたはjQueryが特定の型のfirst-childを取得する

Question

CSS（IE7 +）またはjQueryのいずれかのファースト・チャイルドが特定の型を持つ項目を選択する方法はありますか？次のような擬似コードのように最初の子ですべて李を選択することができ：私は1つのセレクタでそれを取得したいので、私は解決策の@SLaksを探していました

li:first-child(a) 

アップデートは、提案しました。しかし.parent（）メソッドの方が高速です、以下を参照してください。http://jsfiddle.net/c4urself/Qw8fX/

$("li > a:first-child").parent() 

対

$("li:has(>a:first-child)") 

アップデート2

参照jsPerfでここに2つの方法の間の性能差

http://jsperf.com/jquery-has-child-vs-parent-child-and-parent

Answer 1

CSSはこれを行うことはできませんが、jQueryができます：CSSはブラウザがHTMLを読み込むと、前方のみの方法で適用されるように設計されたため、

li:has(>a:first-child) 

CSSはこれを行うことはできません。エレメントの子またはそれに続く兄弟を待つことなく、いつでもに適用されるCSSルールを、に決定できます。あなたはそれの中にネストされたAのスタイルでしょう李項目に必要なスタイルを適用できる第一子の擬似クラス：リチウムを使用してjQueryの$('ul li a:first-child').parent();で

Answer 2

Answer 3

。見てくださいhttp://reference.sitepoint.com/css/pseudoclass-firstchild

Answer 4

私はそれがCSSでは可能ではないと思いますが、jQueryではfilter()を使いたいと思います。

contents()に基づいてフィルタリングすることを忘れないでください。children()ではなく、テキストノードが表示されます。

$(function() { 
    $('li').filter(function() { 
    return $(this).contents().first().is('a'); 
    }).each(function() { 
    $('body').append($(this).text() + '<br/>'); 
    }); 
}); 

http://jsbin.com/olufan

これは、jQueryのセレクタでそれをすべて行うよりも、もう少しコードを占めるが、パフォーマンスはかなり良いはずです。 jQueryセレクタは、単一の用語を指定する場合にのみ実際に高速に動作します。