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

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

时间: 2024-09-13 02:21:12

JavaScript获取table中某一列的值的方法_javascript技巧的相关文章

JavaScript在网页中画圆的函数arc使用方法_javascript技巧

一.arc所需要的参数设置 复制代码 代码如下: arc(x, y, radius, startAngle, endAngle, counterclockwise); 其中x,y,radius都很容易理解,那么重点说说startAngle,endAngle和counterclockwise三个参数! 二.arc参数详解     1,startAngle和endAngle分别指圆开始的角度和结束的角度,手册上面说的是开始的角度为0,结束的角度为Math.PI*2,这样正好画一个圆     2,下面

javascript实现textarea中tab键的缩排处理方法_javascript技巧

本文实例讲述了javascript实现textarea中tab键的缩排处理方法.分享给大家供大家参考.具体如下: 网上搜索了一下相关的解决方法,其它的有使用两三行javascript解决的,但都有一些小小的问题.还有使用JQuery的,也非常简洁. 本文的javascript代码实现了在TEXTAREA中输入TAB键并自动缩进的功能.不过这段代码在谷歌浏览器中不能正常执行,在 复制代码 代码如下: sel =event.srcElement.document.selection.createRa

JavaScript获取页面中表单(form)数量的方法_javascript技巧

本文实例讲述了JavaScript获取页面中表单(form)数量的方法.分享给大家供大家参考.具体如下: 下面的JS代码通过document.forms数组获得网页中表单(form)的数量 <!DOCTYPE html> <html> <body> <h1>sharejs.com</h1> <form name="Form1"></form> <form name="Form2"

javascript获取元素离文档各边距离的方法_javascript技巧

本文实例讲述了javascript获取元素离文档各边距离的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: function getDistance(obj) {   if (!obj instanceof jQuery) {       obj = $(obj);   }   var distance = {};   distance.top = (obj.offset().top - $(document).scrollTop());   distance.bottom

JavaScript实现清空(重置)文件类型INPUT元素值的方法_javascript技巧

本文实例讲述了JavaScript实现清空(重置)文件类型INPUT元素值的方法.分享给大家供大家参考,具体如下: 因为安全限制,脚本是不能随意设置其value值的,所以并不能像其它表单输入域那样用属性来设置使其重置. 重置一个文件域的值,归纳起来主要有 3 种方法. 本文分析这三种方法的浏览器兼容性以及优缺点,并给出一个比较完美的综合方案的代码和Demo. 重置文件域的三种方法: 1. 设置value属性为空. 对于IE11以上和其它较新的非IE的现代浏览器Chrome/Firefox/Ope

javascript事件函数中获得事件源的两种不错方法_javascript技巧

在javascript的事件响应中,许多情况我们需要获得事件源对象来对其属性进行更改,比如更改img的src属性.在事件响应函数中获得事件源的方法有如下两种: 第一种: 直接把作为一个参数传入.例如 复制代码 代码如下: <div id="myid" onclick="show(this);">text</div> <script type="text/javascript"> function show(ob

JavaScript代码编写中各种各样的坑和填坑方法_javascript技巧

坑"这个字,在此的意思是"陷阱".由于 JavaScript "弱语言"的性质,使得其在使用过程中异常的宽松灵活,但也极为容易"中招".这些坑往往隐藏着,所以必须擦亮双眼,才能在学习与应用 JS 的道路上走的一帆风顺. 一.全局变量 JavaScript 通过函数管理作用域.在函数内部声明的变量只在这个函数内部,函数外面不可用.另一方面,全局变量就是在任何函数外面声明的或是未声明直接简单使用的. "未声明直接简单使用"

获取表单控件原始(初始)值的方法_javascript技巧

复制代码 代码如下: var saveObject = {};//保存变更的值 function saveThisData(obj,type){//产生变更的数据会在右侧显示原值 var defaultValue,newValue,key,displayValue; var defaultValueDisplayFont; switch (type) { case 'select'://Ext下拉框 defaultValue=obj.originalValue.split(']')[0].sub

javascript-如何用js替换掉table中某一列的值?

问题描述 如何用js替换掉table中某一列的值? 解决方案 ID Name 1 a 2 c <script src="jquery-1.7.1.min.js"></script> <script> window.onload = function () { $("table").find(".name").html("b"); } </script> 你可以试试,我理解的你应该