动态获取元素的第n个<table> <tbody> <tr> <td> innerHTML </td> </tr> </tbody> </table>

时间:2012-07-06 16:01:25

标签: javascript html dhtml dom

无论如何,我可以得到指定的n th &lt; td&gt;的innerHTML。在&lt; table&gt;中使用JavaSCript?

由于我的表是自动生成的,因此我的&lt; td&gt;没有ID。我使用以下HTML代码:

<table id="table">
  <tr>
    <td onmouseover="myTD()">Cell 1</td>
    <td onmouseover="myTD()">Cell 2</td>
    <td onmouseover="myTD()">Cell 3</td
  </tr>
  <tr>
    <td onmouseover="myTD()">Cell 4</td>
    <td onmouseover="myTD()">Cell 5</td>
    <td onmouseover="myTD()">Cell 6</td>
  </tr>
</table>

但是如何访问,例如,Cell 5?

非常感谢!

8 个答案:

答案 0 :(得分:12)

var cells = document.getElementById('table').getElementsByTagName('td');

这将包含您的所有表格单元格。使用数组表示法访问特定的表示法:

cells[4]

这是一个改变背景颜色的快速演示:

http://jsfiddle.net/jackwanders/W7RAu/

答案 1 :(得分:2)

不确定你想要什么 - Dom:document.getElementsByTagName(“table”)[0] .rows [2] .cells [1]

答案 2 :(得分:2)

将单元格传递回函数:

<td onmouseover="myTD(this)">Cell 1</td>

从对象中获取innerhtml:

function myTD(obj) {
    alert(obj.innerHTML);
}

答案 3 :(得分:1)

只使用CSS即可:

#table tr:nth-child(2) td:nth-child(2)
{
    background:#ff0000;
}​

<强> jsFiddle example

答案 4 :(得分:1)

function addClassToNthTD(n) {
    var table = document.getElementById('table');

    for (var i = 0; i < table.childNodes.length; i++;) {
        var rows = table.childNodes[i];
        for (var j = 0; j < tr.childNodes.length; j++;) {
            n = n - 1;
            if (n == 0) {
                tr.childNodes[j].className = 'foo';
            }
        }
    }
}

答案 5 :(得分:1)

这一行:

$('td')

将代码中的所有td元素放入一个从零开始的数组中,因此以“Cell 5”作为其内容的单元格将是该数组的第五个元素,即:

$('td')[4]

jQuery also accepts CSS style selectors,所以如果您想要连续定位每隔一个单元格,可以使用选择器,例如:

$('tr td:nth-child(2)')

通读我链接的选择器文档,它可以非常方便地适用于这样的情况

答案 6 :(得分:1)

您能否澄清何时(在加载时,在悬停时......)以及您希望在哪里(客户端,服务器端......)?

如果您需要myTD中的单元格,只需使用关键字,该关键字恰好是您的HTMLTableCell:

function myTD() {
   this.style.color="red"; // just for the example, using CSS classes is much better
}

答案 7 :(得分:0)

我不知道你想要做什么,但如果你想做某种“悬停”能力,jquery可以做到这一点非常简单。我创建了一个示例小提琴http://jsfiddle.net/fd3GK/1/