Как получить только прямые дочерние элементы с помощью функции jQuery

у меня есть структура таблицы, как это:

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

в javascript у меня есть переменная tbl стоимостью $(table1), а затем я хочу получить все прямые дочерние элементы (tr) из <tbody> на table1. Мой код :

$('tr', tb1)

видимо, он возвращает все <tr> элементы в table1 и table2. Я думаю, что смогу пройти

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

или такая логика.

Я знаю $('table1 > tbody > tr') может получить прямой ребенок tr. К сожалению, я не могу использовать это.

кто-нибудь имеет хорошее представление об этом?

спасибо.

4 69
jquery parent-child

4 ответа:

можно использовать find():

tbl.find("> tbody > tr")

148

Как @jave.веб упоминается в комментариях

для поиска прямых потомков элемента используйте .children(). Он будет искать только через прямых детей и не пересекать глубже. http://api.jquery.com/children/

16

именно по этой причине следует быть осторожным с вложенными таблицами. Я очень надеюсь, что вы используете их для данных, а не для макета страницы.

еще одна проблема, которая, вероятно, испортит ваш день, - это использование селекторов CSS во вложенных таблицах... у вас в основном та же проблема - вы не можете выбрать TR-элементы внешней таблицы, не выбрав те, которые находятся внутри внутренней таблицы. (Вы не можете использовать дочерний селектор, потому что он не реализован в IE6)

этот должно работать:

$("#table1 > tbody > tr")

тем не менее, я рекомендую вам жестко закодировать элемент TBODY, так как вы не должны полагаться на браузер, чтобы создать его для вас.

4

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

$('tb1 > tr')

0