jQuery第三行第一个单元格选择器动画闪烁

Question

我想在没有属性的情况下使表格单元格内容闪烁。但这不起作用：

var tdnode = document.getElementsByTagName('tr')[2].getElementsByTagName('td')[0];

$(tdnode).animate({backgroundColor: "#FF0000" }, 500);
$(tdnode).animate({backgroundColor: "white" }, 500);

怎么做？

Answer 1

Jquery能够使用:eq() selector

按索引选择元素

$('tr:eq(2) td:eq(0)')将选择表格中第三行的第一个单元格。

包含jQuery UI用于颜色动画，仅jQuery不具备该功能。

链接方法可以避免在对同一元素进行操作时不必要的选择器

$('tr:eq(2) td:eq(0)')
  .animate({backgroundColor: "#ff0000" }, 500)
  .animate({backgroundColor: "#ffffff" }, 500)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.1/jquery-ui.min.js"></script>

<table>
  <tr>
    <td>1-1</td>
    <td>1-2</td>
    <td>1-3</td>
  </tr>
  <tr>
    <td>2-1</td>
    <td>2-2</td>
    <td>2-3</td>
  </tr>
  <tr>
    <td>3-1</td>
    <td>3-2</td>
    <td>3-3</td>
  </tr>
</table>

---

以下是有关jQuery Selectors

的一些文档