Как проверить с Javascript, сколько столбцов данной HTML-таблицы?

Question

Таков максимальный colspan, например:

<table>
 <tr>
  <td> 1 </td>
  <td> 2 </td>
  <td> 3 </td>
 </tr>
 <tr>
  <td> 1 </td>
  <td> 2 </td>
 </tr>
 <tr>
  <td> 1 </td>
 </tr>
</table>

должно дать 3

Answer 1

1. Найдите каждый <tr> с помощью "getElementsByTagName ()"
2. Для каждого <tr> найдите каждый <td> аналогично
3. Подсчитайте элементы <td>, затем выполните итерацию и добавьте "colspan - 1" для каждого <td> с атрибутом "colspan"
4. Поддерживать максимальное количество для всех строк.

Answer 2

См. jsFiddle для примера. Как вы и просили, это простой JavaScript:

var table = document.getElementById("myTable");
var max = 0;

for (var i = 0, iLen = table.rows.length; i < iLen; i++) {
  var temp = 0;
  var cells = table.rows[i].cells;

  for (var j = 0, jLen = cells.length; j < jLen; j++) {
    // This is very important. If you just take length you'll get the
    // the wrong answer when colspan exists
    temp += cells[j].colSpan;
  }

  if (temp > max) {
    max = temp;
  }
}

alert(max);

Answer 3

Каждая таблица имеет массив rows, а каждая строка имеет массив cells. Тогда нужно просто найти максимум.

function calculateCells(){
    var table = document.getElementById("table");
    var max = 0;
    for(var i=0;i<table.rows.length;i++) {
        if(max < table.rows[i].cells.length)
            max = table.rows[i].cells.length;
    }
    return max;
}

Answer 4

См. эту скрипку для версии jQuery.Он подсчитывает количество td элементов в каждом tr и каждый раз проверяет, не было ли обнаружено большее число.Переменная max хранит текущее максимальное количество найденных столбцов:

var max = 0;
$("tr").each(function() {
   var count = $(this).find("td").length;
    if(count > max) max = count;
});
alert(max);