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

news/2024/7/3 17:45:58 标签: javascript, xhtml

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" οnclick="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)单击第二列时



http://www.niftyadmin.cn/n/1306273.html

相关文章

HDU 1085 Holding Bin-Laden Captive!(母函数)

题目&#xff1a;HDU-1085 题目链接&#xff1a;http://acm.hdu.edu.cn/showproblem.php?pid1085 题目&#xff1a; Holding Bin-Laden Captive! Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Total Submission(s): 19057 Accep…

WebService之CXF注解之一(封装类)

Teacher.java&#xff1a; /*** Title:Teacher.java* Package:com.you.model* Description:老师封装类* author:Youhaidong(游海东)* date:2014-5-5 下午11:03:13* version V1.0*/ package com.you.model;import java.io.Serializable;/*** 类功能说明* 类修改者 修改日期* 修改…

编程神书_向编程之神祈祷

编程神书Oh Almighty All-One (01), 全能的哦(01)&#xff0c; Grant me the courage to embrace and early adopt new cool technologies, the serenity to ignore distractions from new technology fads and the wisdom to tell the difference. 让我勇于接受和尽早采…

YSlow开发:自定义规则集

(This is part 3. See part one and part two.) (这是第3部分。请参见第1部分和第2部分。) There are two concepts to remember when working on your YSlow extensions and customizations: 在处理YSlow扩展和自定义项时&#xff0c;要记住两个概念&#xff1a; rules (or &q…

HDU 1171 Big Event in HDU

题目&#xff1a;HDU-1085 题目链接&#xff1a;http://acm.hdu.edu.cn/showproblem.php?pid1085 题目&#xff1a; Big Event in HDU Time Limit: 10000/5000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Total Submission(s): 31958 Accepted Submi…

WebService之CXF注解之二(Service接口)

ITeacherService.java&#xff1a; /*** Title:ITeacherService.java* Package:com.you.service* Description:教师Service接口* author:Youhaidong(游海东)* date:2014-5-5 下午11:06:24* version V1.0*/ package com.you.service;import javax.jws.WebMethod; import javax.j…

HDU 1709 The Balance(母函数)

题目&#xff1a;HDU-1085 题目链接&#xff1a;http://acm.hdu.edu.cn/showproblem.php?pid1085 题目&#xff1a; The Balance Time Limit: 1000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Submission(s): 7089 Accepted Submission(s…

httpwatch使用_使用JavaScript的HTTPWatch自动化

httpwatch使用背景(Background) HTTPWatch (automation)HTTPWatch (自动化)...with PHP (and again and again, and response) ...用PHP (一次又一次&#xff0c;和response )JavaScript shell scripting JavaScript Shell脚本I gave this short presentation at the recent Ya…