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 相关文章推荐
JavaScript XML实现两级级联下拉列表
Nov 10 Javascript
各浏览器中querySelector和querySelectorAll的实现差异分析
May 23 Javascript
javascript客户端遍历控件与获取父容器对象示例代码
Jan 06 Javascript
jQuery+css实现百度百科的页面导航效果
Dec 16 Javascript
45个JavaScript编程注意事项、技巧大全
Feb 11 Javascript
全面解析Bootstrap图片轮播效果
Dec 03 Javascript
用ES6写全屏滚动插件的示例代码
May 02 Javascript
iphone刘海屏页面适配方法
May 07 Javascript
基于vue-cli搭建多模块且各模块独立打包的项目
Jun 12 Javascript
微信小程序实现日期格式化和倒计时
Nov 01 Javascript
解决LayUI加上form.render()下拉框和单选以及复选框不出来的问题
Sep 27 Javascript
Vue中插槽slot的使用方法与应用场景详析
Jun 08 Vue.js
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
php中socket的用法详解
2014/10/24 PHP
CI框架给视图添加动态数据
2014/12/01 PHP
php中session定期自动清理的方法
2015/11/12 PHP
PHP 实现从数据库导出到.csv文件方法
2017/07/06 PHP
php实现微信企业付款到个人零钱功能
2018/10/09 PHP
php无限级分类实现评论及回复功能
2019/02/18 PHP
PHP中非常有用却鲜有人知的函数集锦
2019/08/17 PHP
多广告投放代码 推荐
2006/11/13 Javascript
推荐:极酷右键菜单
2006/11/29 Javascript
表格 隔行换色升级版
2009/11/07 Javascript
js实现图片轮换效果代码
2013/04/16 Javascript
js中传递特殊字符(+,&amp;)的方法
2014/01/16 Javascript
js实现商品抛物线加入购物车特效
2020/11/18 Javascript
JS中Attr的用法详解
2017/10/09 Javascript
angularjs实现table增加tr的方法
2018/02/27 Javascript
js异步上传多张图片插件的使用方法
2018/10/22 Javascript
优雅的elementUI table单元格可编辑实现方法详解
2018/12/23 Javascript
element实现合并单元格通用方法
2019/11/13 Javascript
nuxt 服务器渲染动态设置 title和seo关键字的操作
2020/11/05 Javascript
[07:37]DOTA2-DPC中国联赛2月2日Recap集锦
2021/03/11 DOTA
Python中处理时间的几种方法小结
2015/04/09 Python
python实现k-means聚类算法
2018/02/23 Python
python实现傅里叶级数展开的实现
2018/07/21 Python
pytorch实现对输入超过三通道的数据进行训练
2020/01/15 Python
python hmac模块验证客户端的合法性
2020/11/07 Python
GLAMGLOW香港官网:明星出镜前的秘密武器
2017/03/16 全球购物
岗位职责的构建方法
2014/02/01 职场文书
保健品市场营销方案
2014/03/31 职场文书
2014年预备党员端正入党动机思想汇报
2014/09/13 职场文书
车辆年审委托书范本
2014/09/18 职场文书
党的群众路线个人对照检查材料
2014/09/23 职场文书
2014年社区妇联工作总结
2014/12/02 职场文书
幼儿园大班个人总结
2015/02/28 职场文书
教育读书笔记
2015/07/02 职场文书
入党积极分子培养联系人意见
2015/08/12 职场文书
小学教代会开幕词
2016/03/04 职场文书