jQuery实现获取table表格第一列值的方法


Posted in Javascript onMarch 01, 2016

本文实例讲述了jQuery实现获取table表格第一列值的方法。分享给大家供大家参考,具体如下:

先来看看运行效果截图:

jQuery实现获取table表格第一列值的方法

完整代码如下:

<!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>
<title>无标题页</title>
<script src="jquery-1.4.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
  $("#Button1").click(function(){
    var cols="";
    $("#tb tr").each(function(){
      var text = $(this).children("td:first").text();
      cols+=text+"|";
    })
    cols=cols.length>0?cols.substring(0,cols.length-1):"";
    alert(cols);
  })
})
</script>
</head>
<body>
  <input id="Button1" type="button" value="button" />
  <table id="tab1" border="1" style="width:100%;">
    <tr>
      <th>Id</th>
      <th>Name</th>
      <th>Address</th>
    </tr>
    <tbody id="tb">
    <tr>
      <td>11</td>
      <td>leaf</td>
      <td>gz</td>
    </tr>
    <tr>
      <td>22</td>
      <td>flower</td>
      <td>gz</td>
    </tr>
    </tbody>
  </table>
</body>
</html>

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
js获取浏览器的可视区域尺寸的实现代码
Nov 30 Javascript
Javascript的常规数组和关联数组对比小结
May 24 Javascript
js、css、img等浏览器缓存问题的2种解决方案
Oct 23 Javascript
js中document.write使用过程中的一点疑问解答
Mar 20 Javascript
jQuery可见性过滤器:hidden和:visibility用法实例
Jun 24 Javascript
vue.js中指令Directives详解
Mar 20 Javascript
Node.js发送HTTP客户端请求并显示响应结果的方法示例
Apr 12 Javascript
Bootstrap实现各种进度条样式详解
Apr 13 Javascript
JS实现数组简单去重及数组根据对象中的元素去重操作示例
Jan 05 Javascript
用Vue编写抽象组件的方法
May 06 Javascript
js如何实现元素曝光上报
Aug 07 Javascript
JavaScript基于面向对象实现的无缝滚动轮播示例
Jan 17 Javascript
JavaScript Date对象详解
Mar 01 #Javascript
JavaScript通过使用onerror设置默认图像显示代替alt
Mar 01 #Javascript
jQuery增加与删除table列的方法
Mar 01 #Javascript
JavaScript如何实现组合列表框中元素移动效果
Mar 01 #Javascript
JavaScript常用函数工具集:lao-utils
Mar 01 #Javascript
JavaScript Array对象详解
Mar 01 #Javascript
jQuery计算文本框字数及限制文本框字数的方法
Mar 01 #Javascript
You might like
mac下使用brew配置环境的步骤分享
2011/05/23 PHP
php的数组与字符串的转换函数整理汇总
2013/07/18 PHP
PHP 面向对象程序设计(oop)学习笔记 (四) - 异常处理类Exception
2014/06/12 PHP
PHP实现AES256加密算法实例
2014/09/22 PHP
ECSHOP在PHP5.5及高版本上报错的解决方法
2015/08/31 PHP
PHP chop()函数讲解
2019/02/11 PHP
用js实现的抽象CSS圆角效果!!
2007/05/03 Javascript
JavaScript高级程序设计 读书笔记之十一 内置对象Global
2012/03/07 Javascript
将查询条件的input、select清空
2014/01/14 Javascript
JavaScript对数组进行随机重排的方法
2015/07/22 Javascript
jQuery实现图片走马灯效果的原理分析
2016/01/16 Javascript
jQuery文字横向滚动效果的实现代码
2016/05/31 Javascript
AngularJS基础 ng-include 指令简单示例
2016/08/01 Javascript
使用jquery.qrcode.js生成二维码插件
2016/10/17 Javascript
AngularJS路由切换实现方法分析
2017/03/17 Javascript
JavaScript中的遍历详解(多种遍历)
2017/04/07 Javascript
学习使用Bootstrap页面排版样式
2017/05/11 Javascript
AngularJS中ng-class用法实例分析
2017/07/06 Javascript
JQuery实现ajax请求的示例和注意事项
2018/12/10 jQuery
利用Bootstrap Multiselect实现下拉框多选功能
2019/04/08 Javascript
Node.js API详解之 Error模块用法实例分析
2020/05/14 Javascript
vscode 调试 node.js的方法步骤
2020/09/15 Javascript
[55:45]DOTA2上海特级锦标赛D组败者赛 Liquid VS COL第一局
2016/02/28 DOTA
在Python的Flask框架中使用日期和时间的教程
2015/04/21 Python
Python利用matplotlib生成图片背景及图例透明的效果
2017/04/27 Python
python中单下划线_的常见用法总结
2018/07/10 Python
Jupyter notebook 远程配置及SSL加密教程
2020/04/14 Python
如何将json数据转换为python数据
2020/09/04 Python
猎人靴英国官网:Hunter Boots
2017/02/02 全球购物
iPad和Surface Pro蓝牙键盘:Brydge
2018/11/10 全球购物
澳大利亚优质的家居用品和生活方式公司:Bed Bath N’ Table
2019/04/16 全球购物
澳洲的UGG雪地靴超级市场:Uggs.com.au
2020/04/06 全球购物
大学生涯自我鉴定
2014/01/16 职场文书
作风建设年活动总结
2014/08/27 职场文书
护士年终考核评语
2014/12/31 职场文书
用 Python 元类的特性实现 ORM 框架
2021/05/19 Python