Я хочу дать ALL (включая <th>) клетки первого и последнего столбцов некоторые конкретные классы, я попытался это:Выбор столбцов таблицы (JQuery)
$("table tr:first-child td:first-child").addClass("first-col-cell");
$("table tr:last-child td:last-child").addClass("last-col-cell");
..но это не похоже на работу.
Поблагодарили бы за любую помощь.
EDIT: Ваш селектор был довольно близко:
<script type="text/javascript">
$(function() {
$("table tr td:first-child").text('hello');
$("table tr td:last-child").text('goodbye');
});
</script>
<table>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>
Попробуйте разбить его немного, то обходе вы делаете неправильно
// This will take the first child which is a TD, within any TR in the table.
$("table tr td:first-child").addClass("first-col-cell");
// This will take the first child which is a TR within the table.
$("table tr:first-child").addClass("first-col-cell");
// Just like the above, except now we're doing the last occurances
$("table tr td:last-child").addClass("last-col-cell");
$("table tr:last-child").addClass("last-col-cell");
Тогда мы просто должны убедиться, что знак до все хорошо
<table>
<tr>
<td>1</td>
<td>1</td>
<td>1</td>
<td>1</td>
</tr>
<tr>
<td>2</td>
<td>2</td>
<td>2</td>
<td>2</td>
</tr>
<tr>
<td>3</td>
<td>3</td>
<td>3</td>
<td>3</td>
</tr>
А потом JQuery должен пройти через каждый один со следующими результатами
<table>
<tr class="first-col-cell">
<td class="first-col-cell">1</td>
<td>1</td>
<td>1</td>
<td class="last-col-cell">1</td>
</tr>
<tr>
<td class="first-col-cell">2</td>
<td>2</td>
<td>2</td>
<td class="last-col-cell">2</td>
</tr>
<tr class="last-col-cell">
<td class="first-col-cell">3</td>
<td>3</td>
<td>3</td>
<td class="last-col-cell">3</td>
</tr>
</table>
Код Karmi более компактный, но в любом случае спасибо :-) – 3zzy
Хм, я думал, вы тоже пытались применить код к тэгам TR, по крайней мере, это выглядело так из вашего фрагмента jQuery;) – jakeisonline
Если th элементы материи ... не знаю, как вы хотели бы, чтобы лечить colspans либо.
<!doctype html>
<table>
<tr>
<th></th>
<td>blah</td>
<td></td>
</tr>
<tr>
<td colspan="2"></td>
<td></td>
</tr>
<tr>
<td></td>
<td>blah</td>
<td></td>
</tr>
<tr>
<td></td>
<td>blah</td>
<td></td>
</tr>
</table>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$("table tr :first-child").text('first').css('background', 'yellow');
$("table tr :last-child").text('last').css('background', 'brown');
});
</script>
Я думаю, что выберет, первый и las td всех строк? Я думаю, что это не то, чего хочет OP. – NawaMan
Нет, все тот же. Выбирает только первые найденные ячейки, я хочу применить классы ко всем ячейкам в столбце. Благодарю. – 3zzy
@Nimbuz - см. Мое редактирование. – karim79