jQuery的:第一个和:最后一个元素的第一个孩子
问题描述:
我有一些简单的表(多个,所有与class =“父母”)与多个<tr>
行。这些行中的<td>
单元格具有各自的表格。我想针对<tr>
行第一(父)表,就像这样:jQuery的:第一个和:最后一个元素的第一个孩子
HTML:
<table class="parent">
<tr> <-- match with :first
<td>
<table>
<tr><td></td></tr>
<tr><td></td></tr>
</table>
</td>
</tr>
<tr> <-- match with :last
<td>
<table> <-- so ignore this child ..
<tr><td></td></tr>
<tr><td></td></tr> <-- .. and do NOT match this <tr> with :last
</table>
</td>
</tr>
</table>
的jQuery:
$('table.parent').each(function() {
$(this).find('tr:first').dostuff();
$(this).find('tr:last').dostuff();
});
的:first <tr>
工作正常,因为那总是父母的<tr>
。但是,当我尝试选择:last <tr>
时,它将匹配嵌套表的最后<tr>
,而不匹配父表的最后一个<tr>
。我如何告诉jQuery只查看父表中的<tr>
,并且不要在可能的子表中进一步搜索?
答
代替.find()
(其中找到所有后代)尽量.children()
其中只找到直接子:
$(this).children('tr:first').dostuff();
答
我建议稍微修改您的选择,以确保它可以在一个<tbody>
追加到表浏览器(如Firefox和Chrome):
//tested
$('table.parent > tbody').each(function() {
$(this).children('tr:first').text('hello').css('background-color', 'red');
$(this).children('tr:last').text('hello').css('background-color', 'red');
});