是否有 iniherit "<td>" 选择器？答案

【问题标题】：is there a iniherit "<td>" selector?是否有 iniherit "<td>" 选择器？
【发布时间】：2013-09-27 04:35:31
【问题描述】：

在我制作的扫雷器中，我创建了一个 10*10 <table> 并给了 <td>s ids 0-99。但是我想知道每个<td> 是否有一个继承选择器，比如某种 html5 或 jquery 语法。

我的代码

document.getElementById("grid").innerHTML = "";

var gameBox = "";

    //ten rows
for ( i = 0 ; i < rowAmount ; i++ ) {
    gameBox += "<tr>";
        //ten columns
    for ( var j = 0 ; j < columnAmount ; j++ ) {
            //produce id value
        var idValue = ( i * rowAmount ) + j;
            //write cell
        gameBox += "<td class = 'box' id = '" + idValue + "' ></td>";
    }
    gameBox += "</tr>";
}
document.getElementById("grid").innerHTML = gameBox;

【问题讨论】：

您的意思是一次选择所有 TD（或某个子集）？
为此，我相信您必须为每个 td 提供 id ....然后选择使用该 id ....因为您尝试选择特定的 td
@iBlue 是的......我所做的，所以你的回答是“不”。

标签： html jquery-selectors html-table

【解决方案1】：

要使用 CSS 来选择一行 (row) 和一列 (col) 中的 td，您可以使用

$('tr:nth-child(['+ row +'])>td:nth-child(['+ col +'])');

因为您知道它是 10 乘 10，那么您可以使用简单的数学在表格下选择正确的 td - 类似于

$('table.grid td:nth-child('+ row*10 + col +');

【讨论】：

还有某种html5方法吗？
HTML 处理静态元素的标记，CSS3 处理那些大部分是静态的元素的样式（你在这里有）。除了悬停、选择和一些位之外，它们不处理动态交互。对于动态交互，您需要一种脚本语言来提供帮助，即使它只是在您检测到元素应该处于什么状态后用类标记元素。

【解决方案2】：

您可以只使用$('td') 来获取所有td 元素，但理想情况下，您会在您生成的每个tds 上放置一个类，并且可以选择它，这样您的代码就不会中断在页面某处添加另一个table

【讨论】：

我的意思是选择一个特定的td。对于一张桌子的所有tds，我会给桌子一个班级并打电话给$(".myTable td")