jQuery怎么遍历表格，获取每一列的值
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jQuery怎么遍历表格，获取每一列的值相关的知识，希望对你有一定的参考价值。
<table class="table table-hover" id="test123">
<tr>
<th width="45">选择</th>
<th width="100">驾校名称</th>
<th width="100">合作驾校名称</th>
<th width="100">申请时间</th>
<th width="100">申请状态</th>
<th width="100">操作</th>
</tr>
<tr>
<td><input type="checkbox" name="id" value="1" /></td>
<td>中大驾校</td>
<td>潇湘驾校</td>
<td>2016-04-15 14:40:20</td>
<td class="tablestate">未处理</td>
<td><a class="change button border-blue button-little update" href="#">修改申请状态</a></td>
</tr>
<tr>
<td><input type="checkbox" name="id" value="1" /></td>
<td>中大驾校</td>
<td>潇湘驾校</td>
<td>2016-04-15 14:40:20</td>
<td class="tablestate">未处理</td>
<td><a class="change button border-blue button-little update" href="#">修改申请状态</a></td>
</tr>
</table>
扩展资料：
遍历同胞：
siblings（）：被选中时找到自己的兄弟姐妹，写法有siblings（所有的兄弟姐妹）和siblings（“同级的兄弟姐妹”）。
next（）：被选中时找到自己的下级，写法有 nextAll（找到所有的下级）和next（“找到下一个元素”）和nextuntil（"被选中的元素的范围内的元素"）。
prev(), prevAll() 以及 prevUntil() 方法的工作方式与上面的方法类似，只不过方向相反：它们返回的是前面的同胞元素（在 DOM 树中沿着同胞元素向后遍历，而不是向前）。
first（）：返回被选中的第一元素 ，写法 $("div p").first().css("样式") 。
last（）：被选中的最后一个元素，写法 $("div p").last().css(”样式“) 。
eq（）：返回被选中元素中有索引的元素，索引号，是从0开始不是从1开始比如tr.eq(0).id ==data.eq[i-1].id 或者 tr[0].id = data[i-1].id。
filter（）：删除真正意义上的过滤，写法 $("div ").filter("span").hide() 。
not（）：就是跟filter（）相反的用法。
可以用jQ的each方法遍历表格，再用index()次序值判断第几列，效果实现如下图（获取第一列）：
代码如下：
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
table width: 60%; margin: 60px auto; border-collapse: collapse; font-size: 12px;
table td padding: 1em 2em; border: 1px solid #ccc;
p width: 60%; margin: 0 auto;
</style>
<script src="jquery-164.min.js"></script>
<script>
$(function()
$('#Table1 tr').find('td').each(function()
if ($(this).index() == "0") // 假设要获取第一列的值
$('#Result').append($(this).text() + ',');
);
);
</script>
</head>
<body>
<table id="Table1">
<tr>
<td>一行1列</td>
<td>一行2列</td>
<td>一行3列</td>
<td>一行4列</td>
</tr>
<tr>
<td>二行1列</td>
<td>二行2列</td>
<td>二行3列</td>
<td>二行4列</td>
</tr>
<tr>
<td>三行1列</td>
<td>三行2列</td>
<td>三行3列</td>
<td>三行4列</td>
</tr>
</table>
<p>表格第一列的文字内容分别为：<b id="Result"></b></p>
</body>
</html> 参考技术B <!DOCTYPE HTML>
<html>
<head>
<meta charset=UTF-8 />
<title>Nothing</title>
<style type="text/css">
</style>
<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
<script type="text/javascript">
$ (function ()
$ ('table tr td').each (function ()
alert (this.innerHTML);
)
)
</script>
</head>
<body>
</body>
</html>本回答被提问者和网友采纳 参考技术C <script type="text/javascript">
$(function()
$('#Table1 tr').each(function()
var v=$(this).find("td").eq(0) // 如果当前是第一列
$('#Result').append(v.text() + ',');
);
);
</script>
<table id="Table1">
<tr>
<td>一行1列</td>
<td>一行2列</td>
<td>一行3列</td>
<td>一行4列</td>
</tr>
<tr>
<td>二行1列</td>
<td>二行2列</td>
<td>二行3列</td>
<td>二行4列</td>
</tr>
<tr>
<td>三行1列</td>
<td>三行2列</td>
<td>三行3列</td>
<td>三行4列</td>
</tr>
</table>
<p>表格第一列的文字内容分别为：<b id="Result"></b></p>
以上是关于jQuery怎么遍历表格，获取每一列的值的主要内容，如果未能解决你的问题，请参考以下文章