JQuery - Набор TBODY
Мне определили таблицу следующим образом:
<table id="myTable" cellpadding="0" cellspacing="0">
<thead><tr>
<th>Date</th>
<th>First Name</th>
<th>Last Name</th>
</tr></thead>
<tbody>
<!-- rows will go here -->
</tbody>
</table>
Я пытаюсь динамично заполнить 'myTable' во времени выполнения через JavaScript. Для размещения для этого я использую JQuery. Я хочу записать некоторый HTML в tbody элемент в 'myTable'. Однако у меня есть проблемы при понимании, как сделать это с селекторами. Я знаю, что могу получить использование 'myTable':
$("#myTable")
Я знаю, что могу установить HTML myTable при помощи следующего:
$("#myTable").html(someHtmlString);
Однако это устанавливает HTML всей таблицы. В действительности я просто хочу установить HTML в TBODY 'myTable'. Как я делаю это с JQuery?
Спасибо!
8 ответов
Вы должны использовать:
$("#myTable > tbody");
, который выбирает tbody элементов, которые являются прямым потомком #myTable .
В качестве альтернативы вы можете использовать:
$('tbody', '#myTable');
, который находит все элементы tbody в контексте #myTable .
В jQuery часто есть несколько способов выполнить то, что вам нужно.
Другой способ - это сделать:
$('#myTable').children('tbody');
, что фактически совпадает с моим первым решением, приведенным выше.
В jQuery есть отличная документация:
Селекторы: http://api.jquery.com/category/selectors/
Найдите элемент tbody и используйте append, если нужно добавить строки, или html, если нужно заменить все строки.
$('#myTable tbody').append(someRowHtml);
$('#myTable tbody').html(someRowHtml);
Обратите внимание, что если у вас более одного элемента tbody, вам также нужно использовать селектор :first (или nth-child - не забудьте, что, хотя он нулевой, у вас есть элемент thead), чтобы получить правильный элемент.
$('#myTable tbody:first').append(...);
$('#myTable tbody').append('<tr><td>foo</td><td>bar</td></tr>');
Попробуйте использовать $ ("# myTable> tbody"). Html ("");
присвойте своему телу идентификатор, а затем сделайте с ним то же самое, что и со своей таблицей
Вы можете сделать что-то вроде:
$("#myTable tbody").html(html_here);