Question

我有这张桌子：

<table border=1 id="Table">
<tr> <th> Product </th> <th> Price </th> <th> Shop </th> </tr>
<tr> <td> Stuff1 </td> <td> 10$ </td> <td> Shop1 </td></tr>
<tr> <td> Stuff2 </td> <td> 0$ </td> <td> Shop2 </td></tr>
</table>

我尝试使用以下jQuery代码：

var cell = $("#Table").find("td")[4];
cell.css("background-color", "red");

$("#Table").find("td")[4].innerHTML给了我Stuff2。但我似乎无法使用jQuery更改css甚至使用html()。

Answer 1

此：

var cell = $("#Table").find("td")[4];

为您提供索引4的DOM元素，因此它只有本机DOM方法。

将其更改为调用jQuery方法：

var cell = $("#Table").find("td").eq(4);

或者这个：

var cell = $("#Table td").eq(4);

Answer 2

使用[]提取DOM元素，以便之后不能使用.css（）jquery方法。

使用选择器：

var $cell = $("#Table").find("td:eq(4)"); // or $("#Table").find("td").eq(4);
$cell.css("background-color", "red");

注意：按照惯例，jquery变量应该以{{1}}为前缀（如$），因此很容易就这样。

Answer 3

使用数组表示法时，不再是jQuery对象，而是普通的dom节点。你需要的是：eq选择器：

var cell = $("#Table").find("td:eq(4)");
cell.css("background-color", "red");

比照http://api.jquery.com/eq-selector/

jQuery - 更改特定表元素的颜色

3 个答案: