前言：

先要谢谢George Wing的慷慨赠书《悟透JavaScript》，让我更加感受到了技术交流的重要性，呵呵~

进入正题，面试题中有一题：如何通过JavaScript获取Table中指定行、列的值？ 因为JavaScript是如此的易考，且使用方法即为灵活，不得不防。而最好的办法莫过于：掌握它们！

方法解析：

首先布置环境：用Html构建3*3的Table，一个服务器控件TextBox，用于接收获取的Table值，一个Button，触发获取值的事件。详见代码：


代码

<head runat="server">

    <title>演示获取Table的值</title>

    <script type ="text/javascript" language ="javascript" >

    // Description: 演示用JavaScript，获取Table中指定行、列元素值

   // CopyRight: http://www.cnblogs.com/yangmingming

   // Notes: 采用简单的Table，并结合TextBox获取之

    function GetTable23()

    {

        var txt=document .getElementById ("txtReceiver");

        

        //第一种：用标记id的td元素，获取值方法

        txt .value=document .getElementById ("23").innerHTML ;

        

        //第二种：用获取Table（通过其id），指定获取的行、列

        var valueTd=document .getElementById ("tbl").rows [1].cells[2];

        txt.value=valueTd.innerHTML ;

       

   

    }

    </script>

</head>

<body>

    <form id="form1" runat="server">

    <div>

        <table style="width: 100%;" id ="tbl">

            <tr>

                <td>

                    11

                </td>

                <td>

                    12

                </td>

                <td>

                    13

                </td>

            </tr>

            <tr>

                <td>

                    21

                </td>

                <td>

                   22

                </td>

                <td id ="23">

                    23

                </td>

            </tr>

            <tr>

                <td>

                    31

                </td>

                <td>

                    32

                </td>

                <td>

                    33

                </td>

            </tr>

        </table>

       

        <asp:TextBox ID="txtReceiver" runat="server"></asp:TextBox>

        <input id="btnSubmit" type="button" value="获取" onclick ="GetTable23()"; />

    </div>

    </form>

</body>

</html>

其调试结果为：

可见我们如期获得了第二行、第三列的值。

综述之，对JavaScript的不断深化学习，是必要而迫切的。在现有资料和网络的帮助下，争取尽早实现对其的深层理解，以及应用。呵呵~   

原文：http://www.cnblogs.com/yangmingming/archive/2010/03/26/1697137.html

用JavaScript，获取Table中指定的行、列的更多相关文章

  1. Vue. 之 Element获取table中选中的行

    Vue. 之 Element获取table中选中的行 问题描述: 如下截图,在Table中选择数据后,然后在点击“统计”按钮,获取Table表中选择的行 解决方案: 1. 给“统计”这个按钮添加一个点 ...

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

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

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

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

  4. js循环获取table中的值

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

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

    JavaScript实现获取table中某一列的值 1.实现源代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional/ ...

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

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

  7. [分享·JavaScript]提取Table中的内容到XML对象

    在公司工作的时候,经常需要在前端进行这样的数据提取的操作.而之前的针对每个页面中的Table都重新写原生的JS代码效率太低,且不方便aspx对XML进行处理. 所以,在今天抽时间写了这么一个JS类,见 ...

  8. Javascript获取数组中的最大值和最小值的方法汇总

    比较数组中数值的大小是比较常见的操作,下面同本文给大家分享四种放哪广发获取数组中最大值和最小值,对此感兴趣的朋友一起学习吧   比较数组中数值的大小是比较常见的操作,比较大小的方法有多种,比如可以使用 ...

  9. 使用JavaScript获取url中的参数值

    今天需要用到从url中获取参数,在网上找了几个JavaScript方法,mark下来.   一些可以使用的去获取url中指定的部分:如http://www.mystuff.com.cn/aboutus ...

随机推荐

  1. ssh远程执行nohup命令不退出

    https://blog.csdn.net/oneinmore/article/details/50073443

  2. Android Studio 升级为3.1 踩到的坑

    原文:https://blog.csdn.net/xiariluoxue/article/details/80050700 AndroidStudio.gradle.buildToolsVersion ...

  3. 继承的基本概念： （1）Java不支持多继承，也就是说子类至多只能有一个父类。 （2）子类继承了其父类中不是私有的成员变量和成员方法，作为自己的成员变量和方法。 （3）子类中定义的成员变量和父类中定义的成员变量相同时，则父类中的成员变量不能被继承。 （4）子类中定义的成员方法，并且这个方法的名字返回类型，以及参数个数和类型与父类的某个成员方法完全相同，则父类的成员方法不能被继承。 分析以上程

    继承的基本概念: (1)Java不支持多继承,也就是说子类至多只能有一个父类. (2)子类继承了其父类中不是私有的成员变量和成员方法,作为自己的成员变量和方法.(3)子类中定义的成员变量和父类中定义的 ...

  4. 【Java】 Scanner类的几个方法

    通过 Scanner 类可以获取用户的输入,创建 Scanner 对象的基本语法如下: Scanner sc = new Scanner(System.in); nextInt().next()和ne ...

  5. nginx一些细节知识点补充

    1.upstream 配置代理 upstream local_tomcat { server localhost:8080; } server{ location / { proxy_pass htt ...

  6. UVA - 120Stacks of Flapjacks （摊煎饼。。）排序

    /* 这题使我记起了以前很多忘掉的东西,例如sstream(分割流),deque(双端队列),还有众多函数(STL里的).值得收藏 值得注意的是这题的序号问题,(因为要求输出翻转的位置),序号从右往左 ...

  7. Linux内核代码

    全局描述符表GDT(Global Descriptor Table): (1)在整个系统中,全局描述符表(注意这里是表,表只有一张)GDT只有一张(一个处理器对应一个GDT). (2)GDT可以被放在 ...

  8. BZOJ 3963 HDU3842 [WF2011]MachineWorks cdq分治 斜率优化 dp

    http://acm.hdu.edu.cn/showproblem.php?pid=3842 写的check函数里写的<但是应该是<=,调了一下午,我是个zz. 就是普通的斜率优化因为有两 ...

  9. PHP获取目录和文件的方法

    PHP获取当前目录和相对目录的方法<?php //获取当前文件所在目录,如果 A.php include B.php 则无论写在哪个文件里,都是表示 A.php 文件所在的目录 echo rea ...

  10. Linux怎么开启ssh

    一.查看ssh开启状态 service ssh status 这是已经开启了的状态 二.如果没有开启  键入以下命令开启 service ssh start 三.开启后如果不能利用xshell远程访问 ...