web-dev-qa-db-ja.com

jQuery関数によって直接の子要素のみを取得する方法

私はこのようなテーブル構造を持っています：

_<table1>
  <tbody>
    <tr>
      <td></td>
        ...
      <td>
        <table2>
          <tbody>
            <tr>
              <td></td>
            </tr>
          </tbody>
        </table>
      </td>
    </tr>
   </tbody>
  </table>
_

JavaScriptでは、$(table1)の値を持つ変数tblがあり、_<tbody>_の_table1_のすべての直接の子要素（tr）を取得したいです。私のコードは次のとおりです。

_$('tr', tb1)
_

どうやら、table1とtable2のすべての_<tr>_要素を返します。私は得ることができると思う

_$('tr', tb1).not(function(){return $(this).parent().parent()[0] != tb1;})
_

またはこの種のロジック。

$('table1 > tbody > tr')が直接の子trを取得できることを知っています。残念ながら、これは使用できません。

誰もこれについて良い考えを持っていますか？

ありがとう。

jqueryparent-child
76
Jason Li

find() を使用できます。

tbl.find("> tbody > tr")

163
Josh Leitzel

@ jave.webがコメントで言及したように

要素の直接の子を検索するには、.children()を使用します。直接の子のみを検索し、それ以上深くは探索しません。 http://api.jquery.com/children/

22
Chris

これがまさに、テーブルのネストに注意する必要がある理由です。ページレイアウトではなく、データに使用することを本当に望みます。

おそらくあなたの日を台無しにする別の問題は、ネストしたテーブルでCSSセレクターを使用することです...あなたは基本的に同じ問題を抱えています-あなたは内側のテーブルの内側の要素も選択しないと外側のテーブルのTR要素を選択することはできません（IE6では実装されていないため、子セレクターは使用できません）

これは動作するはずです：

$("#table1 > tbody > tr")

ただし、TBODY要素をハードコードすることをお勧めします。ブラウザに依存して作成しないでください。

4
Šime Vidas

http://api.jquery.com/child-selector/

$('tb1 > tr')

1
Jeremy