jQuery: Wie zähle ich Tabellenspalten?

$("table").find("tr:first td").length;

Ich bearbeitet habe, wie ich nicht erkennen, die Sie waren-zählen der colspan.

Wenn Sie möchten, sind die Verwendung von colspan versuchen Sie eine Schleife durch die td ' s in der ersten Zeile:

var cols = $("table").find("tr:first td");
var count = 0;
for(var i = 0; i < cols.length; i++)
{
   var colspan = cols.eq(i).attr("colspan");
   if( colspan && colspan > 1)
   {
      count += colspan;
   }else{
      count++;
   }
}

InformationsquelleAutor der Antwort scrappedcola

In POJS (Plain Old JavaScript):

HTML:

<table id="foo">
    <thead></thead>
    <tbody>
        <tr>
            <td>1</td>
            <td colspan="2">2</td>
            <td colspan="3">3</td>
        </tr>
    </tbody>
    <tfoot></tfoot>
</table>

JS:

var foo = document.getElementById("foo"), i = 0, j = 0, row, cell, numCols = 0;
//loop through HTMLTableElement.rows (includes thead, tbody, tfoot)
for(i;i<foo.rows.length;i++)
{
    row = foo.rows[i];
    //loop through HTMLTableRowElement.cells
    for(j = 0;j<row.cells.length;j++)
    {
        cell = row.cells[j];
        numCols += cell.colSpan;
        cell = null;
    }
    row = null;
}

alert(numCols) //6;

HTMLTableElement.Zeilen wird, sammeln Sie Zeilen aus jeder HTMLTableSectionElement (THead, TBody und TFoot). Jeder Abschnitt hat auch seine eigenen rows HTMLCollection, so können Sie Sie filtern, wenn es sein muss.

InformationsquelleAutor der Antwort

http://jsfiddle.net/WvN9u/

Nur Aufmerksamkeit colspan attr

InformationsquelleAutor der Antwort Joe

Zu umgehen, td/th Problem (und auch fix ein Problem, wo attr('colspan') gab mir die strings) ging ich mit dieser:

var colspan = 0;
$('#table').find('tr:first').children().each(function(){
    var cs = $(this).attr('colspan');
    if(cs > 0){ colspan += Number(cs); }
    else{ colspan++; }
});

InformationsquelleAutor der Antwort T.J. Compton

Ich vereinfachte Antwort von Craig M.
Und geändert, gelten sowohl für td-und th-tag.

function GetColumnCount($Table)
{
    var ColCount = 0;
    $Table.find("tr").eq(0).find("th,td").each(function ()
    {
        ColCount += $(this).attr("colspan") ? parseInt($(this).attr("colspan")) : 1;
    });

    return ColCount;
}

InformationsquelleAutor der Antwort doctorgu

Mit jQuery und reduzieren, könnte es so Aussehen:

$.fn.tableCellCount = function() {
    return $(this).find('tr:first td, tr:first th').get().reduce(function(a,b) {
        return a + ($(b).attr('colspan') ? parseInt($(b).attr('colspan')) : 1);
    },0)
}

$('table').tableCellCount();

Oder noch einfacher:

$.fn.tableCellCount = function() {
    return $(this).find('tr:first td, tr:first th').get().reduce(function(a,b) {
        return a + (b.colSpan ? parseInt(b.colSpan) : 1);
    },0)
}

$('table').tableCellCount();

InformationsquelleAutor der Antwort shaedrich

/**
 * Get number of columns in table.
 * @param {string} table jQuery selector
 * @param {boolean} [malformed=false] whether to inspect each row of malformed table;
 * may take some time for large tables
 * @returns {?number} number of columns in table, null if table not found.
 */
function getTableColumnsCount(table, malformed) {
    malformed = malformed || false;

    var $table = $(table);
    if (!$table.length) {
        return null;
    }

    var rows = $table.children('thead, tfoot, tbody').children('tr');
    if (!malformed) {
        //for correct tables one row is enough
        rows = rows.first();
    }
    var maxCount = 0;
    rows.each(function () {
        var currentCount = 0;
        $(this).children('th, td').each(function () {
            currentCount += this.colSpan;
        });
        maxCount = Math.max(maxCount, currentCount);
    });

    return maxCount;
}

In Aktion sehen https://jsfiddle.net/kqv7hdg5.

• Nimmt colspan berücksichtigt werden.
• Werke für verschachtelte Tabellen.
• Werke für <thead>, <tfoot>, <tbody>.
• Arbeitet für den mix von <th> und <td>.
• Werke für fehlerhafte Tabellen.

Leicht modifizierte version für diejenigen, die gerne weitergeben möchte die jQuery-Objekt anstelle der Selektor https://jsfiddle.net/5jL5kqp5.

InformationsquelleAutor der Antwort kdmitry