Как изменить ширину столбцов таблицы из JavaScript

Question

У меня проблема с JavaScript.
У меня есть список ячеек таблицы, хранящихся в TabList.
Я хочу найти максимальную ширину, а затем установить эту ширину для всех из них.
Пример кода здесь, но настройка ширины не работает.

var MaxTabWidth = 0;
for (var i = 0; i < TabList.length-1; i++)
{
  if (TabList[i].offsetWidth>MaxTabWidth) 
    MaxTabWidth = TabList[i].offsetWidth;
}

for (var i = 0; i < TabList.length-1; i++)
{
  TabList[i].style.width = MaxTabWidth+"px";
  // TabList[i].width = MaxTabWidth+"px";
  // TabList[i].offsetWidth = MaxTabWidth+"px";
}

Я прокомментировал свои попытки.
Любая помощь?
Это не сделал трюк для меня ..

обновление:
Я уверен, что TabList - это список ячеек, потому что я проверял className.
Я зацикливаюсь до TabList.length-1, потому что я хочу, чтобы последняя ячейка занимала всю ширину таблицы.

Answer 1

Я бы посоветовал вам удалить все css / styling со страницы и протестировать их, чтобы изолировать проблему. Такие вещи часто усложняются css.

Answer 2

Если вы установите ширину всей таблицы на --i * MaxTabWidth. Будет ли это равномерно распределять столбцы? Предположим, ваша таблица называется myTable.

document.getElementById('myTable').width = new String(--i*MaxTabWidth)

Редактировать: Также не будет

for (var i = 0; i < TabList.length-1; i++)

пропустить последний столбец, остановившись на TabList.length-2?

Answer 3

Для чего бы это ни стоило, в jQuery это можно сделать с помощью следующего скрипта, в котором ваша таблица имеет идентификатор «myTable». Если у вас достаточно контроля над средой, чтобы добавить ее в среду, я очень рекомендую ее, поскольку она значительно упрощает подобные задачи.

    var maxWidth = 0;

    $("#myTable td").each(function() {
        if ($(this).width() > maxWidth) {
            maxWidth = $(this).width();
        }
    });
    $("#myTable td").width(maxWidth);