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中某一列的值的更多相关文章

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

    1.实现源码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...

  2. 用JavaScript，获取Table中指定的行、列

    前言: 先要谢谢George Wing的慷慨赠书<悟透JavaScript>,让我更加感受到了技术交流的重要性,呵呵~ 进入正题,面试题中有一题:如何通过JavaScript获取Table ...

  3. javascript闭包获取table中tr的索引 分类： JavaScript 2015-05-04 15:10 793人阅读 评论(0) 收藏

    使用javascript闭包获取table标签中tr的索引 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN& ...

  4. JQuery 全选 反选 获取Table 中指定td的元素值

    //全选 function initTableCheckbox() { var $thr = $('table thead tr'); var $checkAllTh = $('<th>& ...

  5. AutoIt获取Gridview中可以修改列的值

    有一个界面如上图:黑色框框部分是一个整体,也是一个gridview,如果我想把框框中右侧数据获取出来,该如何操作? 我尝试过了很多途径,都无法成功. 今天,我发现,当鼠标焦点在黑色框框左侧的部分的时候 ...

  6. Jquery 获取table中的td元素的值

    <table id="t1"> <tr> <td> 1-1 </td> <td> 1-2 </td> < ...

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

    一.在登录页面自动返回上次请求页面 Request.UrlReferrer比如 if (Request.UrlReferrer != null) { //如果能获取来路地址 Response.Redi ...

  8. js循环获取table中的值

    <script type="text/javascript"> function getTdValue() { var tableId = document.getEl ...

  9. 合并table中某一列相邻的相同的行

    合并table中某一列相邻的相同的行​1. [代码]合并table中某一列相邻的相同的行  <!DOCTYPE html><html>    <head>      ...

随机推荐

  1. Yii2 数据操作DAO

    参考: http://www.yiiframework.com/doc/guide/1.1/zh_cn/database.dao http://blog.csdn.net/hzqghost/artic ...

  2. PHP 8大安全函数

    1. mysql_real_escape_string() 这个函数对于在PHP中防止SQL注入攻击很有帮助,它对特殊的字符,像单引号和双引号,加上了“反斜杠”,确保用户的输入在用它去查询以前已经是安 ...

  3. 服务器忘记mysql密码怎么修改？

    找到配置文件my.ini  ,然后将其打开,可以选择用记事本打开 打开后,搜索mysqld关键字 找到后,在mysqld下面添加skip-grant-tables,保存退出. PS:若提示不让保存时, ...

  4. [LeetCode]题解（python）：014-Longest Common Prefix

    题目来源: https://leetcode.com/problems/longest-common-prefix/ 题意分析: 这道题目是要写一个函数,找出字符串组strs的最长公共前缀子字符串. ...

  5. [LeetCode]题解（python）：024-Swap Nodes in Pairs

    题目来源: https://leetcode.com/problems/swap-nodes-in-pairs/ 题意分析: 给定一个链表,每两个相邻节点就行交换.比如1->2->3-&g ...

  6. django 基础入门（二）

    一.关于数据库 1.首先django 1.9以上等版本不支持pymysql,因此需要做一些调整. 比如在settings.py 加入一段代码: import pymysql pymysql.insta ...

  7. vagrant 入门4

    7. 打包 Packaging , 8080 end 2. 打包Project $ vagrant package --vagrantfile Vagrantfile.pkg 8. 打包完成后,在工程 ...

  8. 【Java】：多线程下载

    import java.io.InputStream; import java.io.RandomAccessFile; import java.net.URL; import java.net.UR ...

  9. Objective-C基础教程读书笔记(7)

    第7章 深入了解Xcode Xcode是一个很好用的工具,有很多强大的功能,不过并不是所有的功能都易于发现.如果你打算长期使用这个强大的工具,就肯定要尽可能多了解它.本章将介绍一些Xcode编辑器的使 ...

  10. cocos2D（二）---- cocos2D文档的使用

    在使用cocos2d进行游戏开发的过程中,难免要查阅cocos2d的API文档.搞清楚怎么使用某个类或者某个方法.幸运的是,cocos2d的作者已经在源码里面加入了文档凝视,我们仅仅须要使用文档生成工 ...