如何使用 jQuery 获取表格单元格值？答案

【解决方案1】：

如果可以，可能值得在 TD 上使用包含客户 ID 的类属性，以便您可以编写：

$('#mytable tr').each(function() {
    var customerId = $(this).find(".customerIDCell").html();    
 });

基本上这与其他解决方案相同（可能是因为我复制粘贴了），但优点是，如果您在列中移动，甚至不需要更改代码结构，甚至将客户放在将 ID 转换为 <span>，前提是您保留了 class 属性。

顺便说一句，我认为您可以在一个选择器中完成：

$('#mytable .customerIDCell').each(function() {
  alert($(this).html());
});

如果这能让事情变得更容易的话。

【讨论】：

我会说 $('#mytable td.customerIDCell').each(function() { alert($(this).html()); });但是+1
:-) 谢谢 - 但是如果你想把它放到一个跨度中怎么办（我的答案中的跨度可能格式错误！）
如果您碰巧在中有（或使用而不是）并且不想要这些，则使用 tr 上的类特别有用。
$('#mytable tr').each(function() { var customerId = $(this).find(".customerIDCell").html(); });
但是如果我也想获得 tr html 那么我们可以做什么

【解决方案2】：

$('#mytable tr').each(function() {
    var customerId = $(this).find("td:first").html();    
});

您正在做的是遍历表中的所有 trs，在循环中找到当前 tr 中的第一个 td，并提取其内部 html。

要选择特定的单元格，您可以使用索引来引用它们：

$('#mytable tr').each(function() {
    var customerId = $(this).find("td").eq(2).html();    
});

在上面的代码中，我将检索 第三行 的值（索引是从零开始的，所以第一个单元格索引是 0）

以下是不使用 jQuery 的方法：

var table = document.getElementById('mytable'), 
    rows = table.getElementsByTagName('tr'),
    i, j, cells, customerId;

for (i = 0, j = rows.length; i < j; ++i) {
    cells = rows[i].getElementsByTagName('td');
    if (!cells.length) {
        continue;
    }
    customerId = cells[0].innerHTML;
}

【讨论】：

谢谢，这对我来说更有用，因为我无法控制我希望使用 jQuery 解析的文档的标记。所以能够使用“td:first”、“td:last”等对我们很有帮助。
eq(2) 将获得第三列的值，而不是第三行。
代码中的 eq(2) 是什么？我的意思是 2 是哪个 td 或 tr 的索引？
@Singh td 集合的索引 2 处的元素，由 find("td") 函数返回。
我喜欢选项 2，索引为 ref，我的小提琴 here

【解决方案3】：

一种不那么古怪的方法：

$('#mytable tr').each(function() {
    if (!this.rowIndex) return; // skip first row
    var customerId = this.cells[0].innerHTML;
});

这显然可以更改为使用非第一个单元格。

【讨论】：

【解决方案4】：

$('#mytable tr').each(function() {
  // need this to skip the first row
  if ($(this).find("td:first").length > 0) {
    var cutomerId = $(this).find("td:first").html();
  }
});

【讨论】：

第一行不用跳过，因为它包含，而不是，所以它们的数据不会被提取出来

【解决方案5】：

试试这个，

$(document).ready(function(){
$(".items").delegate("tr.classname", "click", function(data){
            alert(data.target.innerHTML);//this will show the inner html
    alert($(this).find('td:eq(0)').html());//this will alert the value in the 1st column.
    });
});

【讨论】：

第二个元素，不是第一个，eq从0开始

【解决方案6】：

这行得通

$(document).ready(function() {
    for (var row = 0; row < 3; row++) {
        for (var col = 0; col < 3; col++) {
            $("#tbl").children().children()[row].children[col].innerHTML = "H!";
        }
    }
});

【讨论】：

【解决方案7】：

试试这个：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
    <title>Untitled</title>

<script type="text/javascript"><!--

function getVal(e) {
    var targ;
    if (!e) var e = window.event;
    if (e.target) targ = e.target;
    else if (e.srcElement) targ = e.srcElement;
    if (targ.nodeType == 3) // defeat Safari bug
        targ = targ.parentNode;

    alert(targ.innerHTML);
}

onload = function() {
    var t = document.getElementById("main").getElementsByTagName("td");
    for ( var i = 0; i < t.length; i++ )
        t[i].onclick = getVal;
}

</script>



<body>

<table id="main"><tr>
    <td>1</td>
    <td>2</td>
    <td>3</td>
    <td>4</td>
</tr><tr>
    <td>5</td>
    <td>6</td>
    <td>7</td>
    <td>8</td>
</tr><tr>
    <td>9</td>
    <td>10</td>
    <td>11</td>
    <td>12</td>
</tr></table>

</body>
</html>

【讨论】：

【解决方案8】：

$(document).ready(function() {
     var customerId
     $("#mytable td").click(function() {
     alert($(this).html());
     });
 });

【讨论】：

【解决方案9】：

一个工作示例： http://jsfiddle.net/0sgLbynd/

<table>
<tr>
    <td>0</td>
    <td class="ms-vb2">1</td>
    <td class="ms-vb2">2</td>
    <td class="ms-vb2">3</td>
    <td class="ms-vb2">4</td>
    <td class="ms-vb2">5</td>
    <td class="ms-vb2">6</td>
</tr>
</table>


$(document).ready(function () {
//alert("sss");
$("td").each(function () {
    //alert($(this).html());
    $(this).html("aaaaaaa");
});
});

【讨论】：