Question

jquery怎样获得table里某列的值

Answer 1

css的选择器 nth-child(N) 用于匹配属于其父元素的第 N 个子元素，因此获取table的某列可用如下核心代码

1

$("table tr").find("td:nth-child(n)"); // 获取table所有行第一列

实例演示：点击按钮获取第一列中含有字符1的行标
创建Html元素

1
2
3
4
5
6
7
8
9
10
11

<div class="box">
<span>点击按钮获取第一列中含有字符1的行标：</span>
<div class="content">
<table class="test">
<tr><td>1</td><td>2</td><td>3</td></tr>
<tr><td>4</td><td>5</td><td>6</td></tr>
<tr><td>71</td><td>8</td><td>9</td></tr>
</table>
</div>
<input type="button" value="获取第一列含有字符1的行">
</div>

设置css样式

1
2
3
4
5

div.box{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}
div.box>span{color:#999;font-style:italic;}
div.content{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}
table{border-collapse:collapse;}
td{width:30px;height:30px;line-height:30px;text-align:center;border:1px solid green;}

编写jquery代码

1
2
3
4
5
6
7
8

$(function(){
$("input:button").click(function() {
num = $("table.test tr").find("td:nth-child(1)").map(function(index, elem) {
return $(elem).html().indexOf("1")>=0 ? index+1 : null;
}).get().join(',');
alert("第一列中包含字符1的行为："+num);
});
});