Работаем с таблицами
04.06.2012
Количество
Начнём с получения количества строк и столбцов//Количество строк var CountTr = $('#ThisTableId tr').size(); //Количество столбцов var CountTD = $('#ThisTableId td').size();
Добавляем
Добавить новую строку в таблицу очень легко, добавим строку в конец:
//Добавить строку $('#ThisTableId > tbody').append('Hello');Стоит заметить, что данный код будет работать корректно с таблицами, в которых есть tbody. Так что не поленитесь его вставить ;)
Удаляем
Для удаления рассмотрим следующий пример: У нас есть таблица, состоящая из нескольких строк. Строки естественно разбиты на ячейки, и в каждой строке, в последней ячейке у нас будет изображение с крестиком.
Теперь сделаем так, что бы щёлкнув на это изображение, удалялась вся строка таблицы, добавив в событие onclick изображения следующую строку:
//Удалить строку $($(this).parents().get(1)).remove()В данном коде мы сначала выбираем строку, в которой находится наше изображение
$(this).parents().get(1)get(1) , означает что мы обращаемся к родителю родителя (т.е. второму родителю, ведь счёт ведётся с нуля, для обращения к прямому родителю нужно указать 0, или вообще не использовать get()).
Чуточку подробнее: Наше изображение находится в ячейке, значит ячейка это родитель изображения, но нам нужна вся строка, которая является родителем ячейки в которой находится наше изображение. Значит строка по отношению к изображению - родитель родителя, что в коде выглядит как get(1).
$($(this).parents().get(1)).remove()А далее с помощью remove() удаляем то, что мы выбрали.
Перебор строк
Возможно для перебора всех ячеек есть более оптимальный способ, но вкратце опишу свой, придуманный за несколько минут:
//Количество столбцов var n = $('#ThisTableId td').size(); //Объявляем переменные var task = [], action, i = 0, j = n; //Перебор всех ячеек $('#ThisTableId tr').find('td').each(function() { //Если новая строка, то переходим на новый элемент массива и очищаем его if (j++ % n == 0) task[++i] = ''; //Добавляем содержимое в конец task[i] += $(this).text() + ' '; });Данный код перебирает все ячейки таблицы и заносит данные в массив task, в котором каждый элемент содержит в себе все значения ячеек строки разделённые пробелом.