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

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];

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

将其更改为调用 jQuery 方法：

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

或这个：

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

Answer 2

Using[]提取 DOM 元素，因此以后不能在其上使用 .css() jquery 方法。

使用选择器：

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

注意：按照惯例，jquery 变量应该以$(like $cell) 为前缀，这样它们就很容易了。

Answer 3

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

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

参看。http://api.jquery.com/eq-selector/