jQuery获取table下某一行某一列的值实现代码


Posted in jQuery onApril 07, 2017

jQuery获取table下某一行某一列的值实现代码

最近需要获取到某个table下每一行某一列的值,用jQuery做了一会儿,过程如下,仅供参考:

<div class="div"> 
      <table name="info"><tr><td>lily<span>okok</span></td></tr><tr><td>18</td></tr><tr style="display:none"><td>hahhha</td></tr></table> 
      <table name="info"><tr><td>tom</td></tr><tr><td>22</td></tr><tr style=""><td>hahhha2</td></tr></table> 
      <table name="info"><tr><td>kai</td></tr><tr><td>34</td></tr><tr style="display:none"><td>hahhha3</td></tr></table> 
</div>

 这个大的div下有若干个table,现在我需要获取每个table下某一行某一列的值:

<script> 
      var $tables = $(".div").find("table[name='info']"); 
      //alert($tables.prop("tagName")); //TABLE 
      var length = $tables.length; 
      //alert(length); //3 
      for(var i=0; i<length; i++) { 
        var $table = $tables.eq(i); 
        //alert($table.prop("tagName")); //TABLE 
        //eq(i)表示第i行 
        var nameTd = $table.find("tr").eq(i).children("td").eq(0); 
        //alert(nameTd.prop("tagName")); //TD 
        alert(nameTd.text()); 
      } 
       
      alert(b.indexOf(a)); 
</script>

  可依次弹出结果:lilyokok   tom kai

如果var nameTd = $table.find("tr").children("td").eq(2); 则依次弹出结果:hahhha   hahhha2  hahhha3,这说明,即使你设置隐藏,一样可以获取到值。

注:JQuery中读取dom对象的类型的语法是:$.prop("tagName");还要注意find children eq(用于遍历dom集合中元素对象)等的用法。

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

jQuery 相关文章推荐
jQuery插件HighCharts绘制简单2D折线图效果示例【附demo源码】
Mar 21 jQuery
jQuery EasyUI之验证框validatebox实例详解
Apr 10 jQuery
使用jQuery实现简单的tab框实例
Aug 22 jQuery
jQuery实现可兼容IE6的遮罩功能详解
Sep 19 jQuery
jquery animate动画持续运动的实例
Nov 29 jQuery
jQuery中的for循环var与let的区别
Apr 21 jQuery
jQuery使用bind动态绑定事件无效的处理方法
Dec 11 jQuery
JQuery获取元素尺寸、位置及页面滚动事件应用示例
May 14 jQuery
jquery实现二级导航下拉菜单效果实例
May 14 jQuery
jQuery设置下拉框显示与隐藏效果的方法分析
Sep 15 jQuery
jquery.validate自定义验证用法实例分析【成功提示与择要提示】
Jun 06 jQuery
jQuery实现评论模块
Aug 19 jQuery
jQuery实现文章图片弹出放大效果
Apr 06 #jQuery
jQuery自定义图片上传插件实例代码
Apr 04 #jQuery
jQuery使用unlock.js插件实现滑动解锁
Apr 04 #jQuery
利用jquery正则表达式在页面验证url网址输入是否正确
Apr 04 #jQuery
jQuery中animate()的使用方法及解决$(”body“).animate({“scrollTop”:top})不被Firefox支持的问题
Apr 04 #jQuery
使用jQuery卸载全部事件的思路详解
Apr 03 #jQuery
jQuery实现分页功能(含ajax请求、后台数据、附完整demo)
Apr 03 #jQuery
You might like
使用 eAccelerator加速PHP代码的方法
2007/09/30 PHP
仿dedecms下拉分页样式修改的thinkphp分页类实例
2014/10/30 PHP
深入讲解PHP的Yii框架中的属性(Property)
2016/03/18 PHP
微信开发之获取JSAPI TICKET
2017/07/07 PHP
PHP框架实现WebSocket在线聊天通讯系统
2019/11/21 PHP
js 图片轮播(5张图片)
2008/12/30 Javascript
jquery取消选择select下拉框示例代码
2014/02/22 Javascript
js中top的作用深入剖析
2014/03/04 Javascript
跟我学习javascript的this关键字
2020/05/28 Javascript
javascript中错误使用var造成undefined
2016/03/31 Javascript
jQuery 选择同时包含两个class的元素的实现方法
2016/06/01 Javascript
Javascript之面向对象--封装
2016/12/02 Javascript
如何学JavaScript?前辈的经验之谈
2016/12/28 Javascript
jQuery中DOM节点删除之empty与remove
2017/01/20 Javascript
javascript html5轻松实现拖动功能
2017/03/01 Javascript
js实现图片放大展示效果
2017/08/30 Javascript
jquery鼠标悬停导航下划线滑出效果
2017/09/29 jQuery
在vscode里使用.vue代码模板的方法
2018/04/28 Javascript
使用jquery DataTable和ajax向页面显示数据列表的方法
2018/08/09 jQuery
详解ES6 系列之异步处理实战
2018/10/26 Javascript
微信小程序 wx.getUserInfo引导用户授权问题实例分析
2020/03/09 Javascript
使用Typescript和ES模块发布Node模块的方法
2020/05/25 Javascript
Python 爬虫学习笔记之多线程爬虫
2016/09/21 Python
Python使用struct处理二进制的实例详解
2017/09/11 Python
Pandas 数据处理,数据清洗详解
2018/07/10 Python
python中pip的安装与使用教程
2018/08/10 Python
Python 随机生成测试数据的模块:faker基本使用方法详解
2020/04/09 Python
基于python爬取梨视频实现过程解析
2020/11/09 Python
HTML5的hidden属性兼容老浏览器的方法
2014/04/23 HTML / CSS
印度电子产品购物网站:Vijay Sales
2021/02/16 全球购物
圣诞节红领巾广播稿
2014/02/03 职场文书
四查四看自我剖析材料
2014/09/19 职场文书
监察局领导班子四风问题整改措施思想汇报
2014/10/05 职场文书
2015年小学远程教育工作总结
2015/07/28 职场文书
python 实现德洛内三角剖分的操作
2021/04/22 Python
nginx容器方式反向代理实战
2022/04/18 Servers