jQuery Selector для всех потомков элемента

Question

У меня есть <div id="rptViewer"> с несколькими div и таблицами, которые, в свою очередь, могут иметь несколько div и таблиц.Мне нужен селектор jQuery для прямого или косвенного выбора всех элементов div или таблиц в «rptViewer» (вложение).

Я пробую следующие селекторы jQuery.

<script type="text/javascript">
    $(document).ready(function() {
        $("[id*='rptViewer'] table").each(function(i, item) {
             $(item).css('display', 'inline-block');
            });
            $("[id*='rptViewer'] div").each(function(i, item) {
                $(item).css('display', 'inline-block');
            });            

            $("[id*=rptViewer] table").attr("width","");
        });
    </script>

Но когда япроверяю это с помощью firebug, я обнаружил, что только прямой потомок 'rptViewer' получает 'встроенный блок' CSS

Answer 1

Если вы хотите включить класс для всей таблицы и div внутри rptViewer. Вы можете сделать это так:

$("table, div", "#rptViewer").addClass('someStyle');

Но если вы хотите включить класс только для настоящих детей rptViewer. Вы можете сделать это так:

$("#rptViewer > table, #rptViewer > div").addClass('someStyle');

Answer 2

Вместо добавления стилей в JavaScript, добавьте стиль через CSS:

#rptViewer div,
#rptViewer table {
  display: inline-block;
}

---

Вы можете использовать селектор [id] и список выборов через запятую:

$('#rptViewer div, #rptViewer table')...

Если вы хотите выбрать больше элементов, вы можете использовать .find():

$('#rptViewer').find('div, table')...

---

Учитывая, что вы используете rptViewer в качестве [id], я предполагаю, что вы используете ASP.NET, и в этом случае вы должны добавить класс для элемента, чтобы упростить выбор:

$('.viewer').find('div, table')...