Тема: Скрипт для динамічного створення таблиці
з попередньої теми
Я створив робочий скрипт для динамічного створення таблиці, він мене майже влаштовує, за виключенням одного, одночасно не можна зробити об'єднання рядків і стовпців.
Можете мені допомогти, я стирався його максимально прокоментувати, тому думаю він буде зрозумілий для вас
(тобто я хочу щоб методи
work_space.merge_col(3, 2, 4);
і
work_space.merge_row(3, 2, 4);
могли працювати разом)
var work_space =
{
_table: null, /*об'єкт таблиці*/
create_table: function(row, col) /*функція створює таблицю*/
{
this._table = document.createElement("table"); /*створити таблицю*/
var table_tr; /*тимчасова змінна тега tr*/
var table_td; /*тимчасова змінна тега td*/
for(var i = 0; i < row; i++) /*цикл рядків*/
{
table_tr = document.createElement("tr"); /*створити тег tr*/
for(var j = 0; j < col; j++) /*цикл стовпців*/
{
table_td = document.createElement("td"); /*створити тег td*/
table_tr.appendChild(table_td); /*приєднати тег td до tr*/
}
this._table.appendChild(table_tr); /*приєднати тег tr до таблиці*/
}
return this._table; /*повернути таблицю*/
},
merge_row: function(num_row, from, to) /*об'єднати рядки*/
{
/*
num_row - номер рядка
from - з якого рядка починати об'єднання
to - яким рядком закінчити об'єднання
наприклад для таблиці 5х5, можна зробити об'єднання в третьому
рядку, з другого по четвертий стовпець
виклик методу матиме вигляд work_space.merge_row(3, 2, 4);
*/
if(num_row <= 0 || from <= 0 || to < from) /*перевірка на коректність параметрів*/
return -1; /*помилка*/
from--, to--; /*зменшуємо значення тому що масив починається з нуля*/
var row_list = this._table.children[num_row - 1]; /*отримуємо об'єкт рядків (тег tr)*/
for( var i = from; i < to; i++) /*цикл по дітях вузла tr*/
row_list.removeChild(row_list.children[from]); /*видаляємо дітей*/
row_list.children[from].setAttribute('colspan', to - from + 1); /*присвоюємо атрибут colspan з кількістю об'єднаних клітинок*/
},
merge_col: function(num_col, from, to) /*об'єднати стовпців*/
{
/*
num_row - номер стовпця
from - з якого рядка починати об'єднання
to - яким рядком закінчити об'єднання
наприклад для таблиці 5х5, можна зробити об'єднання в третьому
стовпцю, з другого по четвертий рядок
виклик методу матиме вигляд work_space.merge_col(3, 2, 4);
*/
if(num_col <= 0 || from <= 0 || to < from) /*перевірка на коректність параметрів*/
return -1; /*помилка*/
var row_list = this._table.children[from - 1]; /*отримуємо об'єкт рядків (тег tr)*/
row_list.children[num_col - 1].setAttribute('rowspan', to - from + 1); /*присвоюємо атрибут rowspan з кількістю об'єднаних клітинок*/
for( var i = from; i < to; i++) /*цикл по дітях вузла tr*/
this._table.children[i].removeChild(this._table.children[i].children[0]); /*видаляємо дітей*/
}
}
window.onload = function()
{
var _table = work_space.create_table(5, 5);
work_space.merge_col(3, 2, 4);
//work_space.merge_row(3, 2, 4);
_table.setAttribute('border', 1);
document.body.appendChild(_table);
};