2014-09-21 53 views
0

我想閃爍表格單元格內容沒有屬性。但是這不起作用:jQuery第三行第一個單元格選擇器動畫閃爍

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

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

如何做到這一點?

回答

2

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