JavaScript实现获取table中某一列的值

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)单击第二列时

JavaScript实现获取table中某一列的值

时间: 2024-10-24 16:52:59

JavaScript实现获取table中某一列的值的相关文章

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="C

用JavaScript,获取Table中指定的行、列

<html> <head runat="server"> <title>演示获取Table的值</title> <script type ="text/javascript" language ="javascript" > // Description: 演示用JavaScript,获取Table中指定行.列元素值 // CopyRight: http://www.cnblogs.co

javascript闭包获取table中tr的索引

使用javascript闭包获取table标签中tr的索引 <!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" xml:lang="en&quo

【前端基础】统一修改table中某一列的值

一.需求 需求比较简单,就是先修改第一列中age下面的input中的值,然后点击age这个submit按钮,会将这一列中所有的值都修改称第一列中age对应的值,如上图所示: 二.实现 1.针对这个需求,我第一反应就是先获取第一列age这列对应的value,然后用这个值给其他行的这一列的value进行赋值:所以我的代码实现如下: <!DOCTYPE html> <html> <head> <title>test</title> </head&

【2017-06-29】在登录页面自动返回上次请求页面、Js获取table中的行数与列数

一.在登录页面自动返回上次请求页面 Request.UrlReferrer比如 if (Request.UrlReferrer != null) { //如果能获取来路地址 Response.Redirect(Request.UrlReferrer.ToString());} else { //没有来路地址 Response.Redirect("index.aspx"); 二.Js获取table中的行数与列数 var table =document.getElementById(&qu

关于Jquery获取Table中td内的内容

$(this).children().eq(1).text()获取的是显示的值$(this).children().eq(1).html()获取的是<td></td>之间的所有内容$('.trSelected',grid).find("td").eq(7).text();获取的是选中的某行的内容 遍历表<table id="gird"..... $("#grid tr").each(function() {     

HTML JS获取到table中所有的input的值 传递到前端

1.获取table对象 2.行循环.列循环然后遍历每一个格子里面的input值 3.用连接符连接 4.放置到form的隐藏域里面. 5.传递到后台. js代码:注意:1.input必须跟[0]否则无法取出值  2.在JS的双引号里面不能在用""改成''而且{}在引号里也会被识别报错.将字符串传回后台处理即可 function GetInfoFromTable() { var tableInfo = ""; var tableObj = document.getEle

javascript如何获取数组中的最大值和最小值

javascript如何获取数组中的最大值和最小值:比较数组中数值的大小时比较常见的操作,比较大小的方法有多种,比如可以使用自带的sort()函数,下面再来介绍一下其他比较常用的方法,代码如下: function getMaximin(arr,maximin) { if(maximin=="max") { return Math.max.apply(Math,arr); } else if(maximin=="min") { return Math.min.appl

Javascript RegExp对象---获取url中某一个参数的值

RegExp 对象 RegExp 对象表示正则表达式,它是对字符串执行模式匹配的强大工具. 直接量语法 /pattern/attributes实例:window.location.href:http://localhost:8100/aspx/main/ServiceCenter_list.aspx?category_id=93&page=2要匹配到的category_id=93:/category_id=\d+/g 创建 RegExp 对象的语法: new RegExp(pattern, at