2011-07-25 50 views
0

tbodyの子孫を選択するにはどうしたらできますか?たとえば、次のjQueryのステートメントを使用して:子要素ではなく子要素の選択

alert($('.someClass tbody tr').length); 

は、以下のサンプルHTMLを使用して2の長さが得られます:

<div> 
    <table class='someClass'> 
    <tbody> 
     <tr> 
     <td> 
      <span>cell 1-1</span> 
      <table> 
       <tbody> 
       <tr class='level-2'> 
        <td> 
        <span>cell 1-2</span> 
        <table> 
         <tbody> 
         <tr class='level-3'> 
          <td><span>cell 1-3</span></td> 
         </tr> 
         </tbody> 
        </table> 
        </td> 
       </tr> 
       </tbody> 
      </table> 
      </td> 
     </tr> 
     <tr> 
      <td> 
      <span>cell 2-1</span> 
      <table> 
       <tbody> 
       <tr class='level-2'> 
        <td> 
        <span>cell 2-2</span> 
         <table> 
         <tbody> 
          <tr class='level-3'> 
          <td><span>cell 2-3</span></td> 
          </tr> 
         </tbody> 
         </table> 
        </td> 
        </tr> 
       </tbody> 
       </table> 
      </td> 
      </tr> 
     </tbody> 
     </table> 
    </div> 
+7

サイドノートでは、テーブルマークアップを更新する必要があります。 trタグをtdタグの内側にネストすることはできません。 –

+0

マークアップが更新されました。 – stavarotti

+0

あなたのHTMLは合法ではありません。 ''の前に '

'が必要です。 –

答えて

5

あなたはこのようにそれを行うことができます。

alert($('.someClass > tbody > tr').length); 

だこと実際にはjQueryがうまく実装しているcss2セレクタです。

+0

上記のステートメントは、6のカウントを生成する子供の子供を選択します。 – stavarotti

+2

これはCSS 3セレクタではありません。これは実際にはCSS 2以降に指定されています。 – jwueller

+0

Mmm ...これは避けるべきですが、この 'alert($。 '.someClass> tbody> tr').length);を試してください。 ' – Emmanuel

4

あなたは直接の子孫のみを選択しますchild selector>、使用することができます:あなたは使用することができませんでし

var element = $("#element"); 
var children = element.children("tr"); 
+0

a.k.a. "子セレクタ" – Claudio

0

Element > Childセレクタからの、children方法もありますJqueryとelement.children.lengthまたはさらにelement.childElementCountを持っています。

0

別に
$('.someClass > tbody > tr') 
関連する問題