jquery里操作table表格的各种方法

1.鼠标经过时换色：

1 $("#table tr").hover(function(){
2     $(this).children("td").addClass("on");
3 },function(){
4     $(this).children("td").removeClass("on")
5 });

2.奇偶行不同颜色：

1  //偶数行 奇数行的话 odd改为even
2  $("#table tr:odd").find("td").css("background-color","#e7ffff");

3.动态插入一行：

1 //在表格的末尾添加一行   
2 $("#table").append('<tr><td>new</td><td>new</td></tr>');    
3 //在表格的开头添加一行    
4 $("#table").prepend('<tr><td>new</td><td>new</td></tr>'); 
5 //在表格的第二行后面插入一行  
6 $("#table tr").eq(1).after('<tr><td>new</td><td>new</td></tr>');

4.动态插入一列：

1 //在表格的末尾添加一列   
2 $("#table tr").append('<td>newTD</td>');   
3 //在表格的开头添加一列   
4 $("#table tr").prepend('<td>newTD</td>');   
5 //在表格的第二列后添加一列   
6 $("#table tr td:nth-child(2)").after('<td>newTD</td>');

5.显示/隐藏第三行：

1 //切换第三行的状态 如果隐藏则显示 如果处在显示状态则隐藏
2 $("#table tr").eq(2).toggle();
3 //隐藏
4 $("#table tr").eq(2).hide();
5 //显示
6 $("#table tr").eq(2).show();

6.显示/隐藏第三列：

 1 //第一种方法
 2 $("#table tr td:nth-child(3)").toggle();
 3      
 4 //第二种方法    
 5 $("#table tr").each(function(){ 
 6     //第一种写法     
 7     $(this).find("td").eq(2).toggle();
 8     //第二种写法        
 9     $("td",$(this)).eq(2).toggle();    
10 });

7.删除第四行： 

1 $("#table tr").eq(3).remove();

8.删除第五列：

1 $("#table tr td:nth-child(5)").remove();

9.只留前三行，其它删除：

1 $("#table tr:gt(2)").remove();

10.删除第2行外所有行：

1 $("#table tr:not(:eq(1))").remove();

11.删除第2到第4行：

1 $("#table tr").slice(1,4).remove();

补：删除后三行：

1 $("#table tr").slice(-3).remove()

12.只保留第2到第4行，其它全删除：

1 $("#table tr").not($("#table tr").slice(1,4)).remove();

13.读取第3行第4列的值：

1 var v=$("#table tr:eq(2) td:eq(3)").html();

14.读取第3列所有的值：

1 var arr=[];   
2 $("#table tr").each(function(){       
3     arr.push($(this).find("td").eq(2).html());    
4 });  
5 alert(arr.join(","));

15.读取第3行所有的值：

1 var arr=[];   
2 $("#table tr:eq(2) td").each(function(){     
3     arr.push($(this).html());    
4 });  
5 alert(arr.join(","));

如果上面这种方法不喜欢，那也可以直接按你的意思，我们来直接删除前三行和后四行：

1 $("#table tr:lt(3)").remove();
2 //lt的意思是获取索引比3小的，索引是从0开始的，也就是获取到的是0 1 2 ，正好是前三行
3  
4 //下面来删除后四行，
5 因为不知道你的表格有多少行，所以需要先判断：
6 var max=$("#table tr:last").index();//获取最后一行的索引值
7 //获取比上面索引值小三的行，删除就行
8 var get=max-4;//注意这里是减四
9 $("#table tr:gt("+get+")").remove();