JavaScript获取table中某一列的值的方法

更新时间：2014年05月06日 09:59:26 作者：

这篇文章主要介绍了JavaScript获取table中某一列的值的方法,需要的朋友可以参考下

1、实现源码

 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>JavaScript实现获取table中某一列的值</title> 
<script type="text/javascript"> 
function getTdValue() 
{ 
var tableId = document.getElementById("tab"); 
var str = ""; 
for(var i=1;i<tableId.rows.length;i++) 
{ 
alert(tableId.rows[i].cells[1].innerHTML); 
} 
} 
</script> 
</head> 

<body style="width:100%; height:100%;"> 
<table style="width:100%; height:100%;" id="tab" onclick="getTdValue()" border="1" cellpadding="1" cellspacing="1"> 
<tr style="background-color:#CCC;"> 
<th>学号</th> 
<th>姓名</th> 
<th>性别</th> 
<th>年龄</th> 
</tr> 
<tr> 
<td>1</td> 
<td>李斯</td> 
<td>男</td> 
<td>22</td> 
</tr> 
<tr> 
<td>2</td> 
<td>王倩</td> 
<td>女</td> 
<td>20</td> 
</tr> 
<tr> 
<td>3</td> 
<td>于谦</td> 
<td>男</td> 
<td>18</td> 
</tr> 
<tr> 
<td>4</td> 
<td>柳浪</td> 
<td>女</td> 
<td>19</td> 
</tr> 
<tr> 
<td>5</td> 
<td>诸葛亮</td> 
<td>男</td> 
<td>20</td> 
</tr> 
<tr> 
<td>6</td> 
<td>东方云</td> 
<td>女</td> 
<td>21</td> 
</tr> 
<tr> 
<td>7</td> 
<td>公孙策</td> 
<td>男</td> 
<td>22</td> 
</tr> 
<tr> 
<td>8</td> 
<td>宝清</td> 
<td>女</td> 
<td>23</td> 
</tr> 
<tr> 
<td>9</td> 
<td>智育</td> 
<td>男</td> 
<td>20</td> 
</tr> 
<tr> 
<td>10</td> 
<td>柳丝丝</td> 
<td>女</td> 
<td>21</td> 
</tr> 
</table> 
</body> 
</html> 

2、设计结果

（1）初始化时

（2）单击第二列时

您可能感兴趣的文章:

JS+Ajax实现百度智能搜索框
现在遇到这样的需求，要求输入一个a之后会出现包含a的下拉列表，当我们点击某一个的时候，搜索框中就会出现点击的值。下面小编给大家分享同js和ajax实现百度智能搜索框，需要的的朋友参考下实现代码
2017-08-08
从理论角度讨论JavaScript闭包
本文将介绍一个在JavaScript经常会拿来讨论的话题 —— 闭包（closure）。闭包其实已经是个老生常谈的话题了；有大量文章都介绍过闭包的内容，尽管如此，这里还是要试着从理论角度来讨论下闭包，看看ECMAScript中的闭包内部究竟是如何工作的
2019-04-04
javascript hashtable 修正版下载
javascript hashtable 修正版 hashtable hashset 下载,需要的朋友可以收藏下。
2010-12-12
JavaScript 实现日期时间转时间戳
这篇文章主要介绍了JavaScript 实现日期时间转时间戳，文章围绕主题展开详细的内容介绍，具有一定的参考价值，需要的小伙伴可以参考一下
2022-08-08
JS简单实现城市二级联动选择插件的方法
这篇文章主要介绍了JS简单实现城市二级联动选择插件的方法,涉及javascript实现select遍历与设置技巧,非常简单实用,需要的朋友可以参考下
2015-08-08
Java前后端分离之权限管理示例分析
权限管理就是管理用户对于资源的操作。本 CRM 系统的权限（也称作资源）是基于角色操作权限来实现的，即RBAC（Role-Based Access Control，基于角色的访问控制），就是用户通过角色与权限进行关联
2022-08-08
div模拟滚动条效果示例代码
滚动条想必大家都见过吧，在本文将使用div来模拟滚动条的效果，具体实现如下，感兴趣的朋友可以参考下
2013-10-10
Javascript实现鼠标右键特色菜单
鼠标右键大家都经常操作，但是鼠标的内容是不是符合大家的“口味”？这篇文章就是教大家如何定制自己专属鼠标右键,需要的朋友可以参考下
2015-08-08
获取今天，昨天，本周，上周，本月，上月时间（实例分享）
本篇文章主要分享了获取今天，昨天，本周，上周，本月，上月时间实例代码，具有一定的参考价值，下面跟着小编一起来看下吧
2017-01-01
es7学习教程之Decorators（修饰器）详解
这篇文章主要给大家介绍了关于es7中Decorators（修饰器）的相关资料，文中通过示例代码给大家介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面跟着小编一起来学习学习吧。
2017-07-07