Вставка столбца таблицы с помощью jQuery
У меня есть таблица данных, в которой мне нужно динамически добавлять столбец. Допустим, у меня есть эта базовая таблица, чтобы начать с:
<table>
<tr><td>cell 1</td><td>cell 2</td><td>cell 3</td></tr>
<tr><td>cell 1</td><td>cell 2</td><td>cell 3</td></tr>
<tr><td>cell 1</td><td>cell 2</td><td>cell 3</td></tr>
</table>
Я хотел бы вставить столбец между ячейкой 1 и ячейкой 2 в каждой строке... Я пробовал это, но он просто не работает, как я ожидаю...
$(document).ready(function(){
$('table').find('tr').each(function(){
$(this).prepend('<td>cell 1a</td>');
})
})
Ответы
Ответ 1
Попробуйте следующее:
$(document).ready(function(){
$('table').find('tr').each(function(){
$(this).find('td').eq(0).after('<td>cell 1a</td>');
});
});
Ваш исходный код добавит столбец в конец каждой строки, а не между столбцами. Это находит первый столбец и добавляет ячейку рядом с первым столбцом.
Ответ 2
$('table > tr > td:first-child').after( '<td>cell 1a</td>' );
tr > td
выбирает td
первого уровня после a tr
и after
вставляет данные вне элемента.
Ответ 3
$('td:first-child').after('<td>new cell</td>');