js中获取 table节点各tr及td的内容简单实例


Posted in Javascript onOctober 14, 2016
<table id="tb1" width="200" border="1" cellpadding="4" cellspacing="0">
    <tr>
        <td height="25">第一行</td>
    </tr>
    <tr>
        <td height="25">第二行</td>
    </tr>
    <tr>
        <td height="25">第三行</td>
    </tr>
    <tr>
        <td height="25">第四行</td>
    </tr>
		 <tr>
        <td height="25"><input type="button" name="getTableContent" value="获得表格内容" onclick="getTableContent(this)"></td>
    </tr>
</table>

如上所示代码,按钮点击事件中传入this对象,此对象就是按钮本身。通过以下方法测试获取表格的数据

<script language="javascript">
    function getTableContent(node) {
// 按钮的父节点的父节点是tr。
		  var tr1 = node.parentNode.parentNode;
			alert(tr1.rowIndex);
			alert(tr1.cells[0].childNodes[0].value); //获取的方法一
alert(tr1.cells[0].innerText); 
// 通过以下方式找到table对象,在获取tr,td。然后获取td的html内容
        var table = document.getElementById("tb1");//获取第一个表格
		
        var child = table.getElementsByTagName("tr")[rowIndex - 1];//获取行的第一个单元格
				
        var text = child.firstChild.innerHTML;
        window.alert("表格第" + rowIndex + "的内容为: " + text);
    }
</script>

以上就是小编为大家带来的js中获取 table节点各tr及td的内容简单实例全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
Document对象内容集合(比较全)
Sep 06 Javascript
javascript event 事件解析
Jan 31 Javascript
深入理解JavaScript系列(33):设计模式之策略模式详解
Mar 03 Javascript
jQuery动态背景图片效果实现方法
Jul 03 Javascript
JS简单模拟触发按钮点击功能的方法
Nov 30 Javascript
jQuery代码实现图片墙自动+手动淡入淡出切换效果
May 09 Javascript
总结Javascript中数组各种去重的方法
Oct 04 Javascript
jQuery插件HighCharts实现的2D对数饼图效果示例【附demo源码下载】
Mar 09 Javascript
Vue-resource拦截器判断token失效跳转的实例
Oct 27 Javascript
vue axios请求超时的正确处理方法
Apr 02 Javascript
JS实现的3des+base64加密解密算法完整示例
May 18 Javascript
解决bootstrap-select 动态加载数据不显示的问题
Aug 10 Javascript
jQuery ajaxForm()的应用
Oct 14 #Javascript
jQuery的 $.ajax防止重复提交的两种方法(推荐)
Oct 14 #Javascript
jQuery如何防止Ajax重复提交
Oct 14 #Javascript
require.js 加载 vue组件 r.js 合并压缩的实例
Oct 14 #Javascript
浅析JS中对函数function的理解(基础篇)
Oct 14 #Javascript
js插件Jcrop自定义截取图片功能
Oct 14 #Javascript
jQuery.form.js插件不能解决连接超时(timeout)的原因分析及解决方法
Oct 14 #Javascript
You might like
一拳超人中怪人协会钦定! S级别最强四人!
2020/03/02 日漫
php操作SVN版本服务器类代码
2011/11/27 PHP
PHP禁止个别IP访问网站
2013/10/30 PHP
php防止恶意刷新与刷票的方法
2014/11/21 PHP
php 常用的系统函数
2017/02/07 PHP
tp5(thinkPHP5框架)captcha验证码配置及验证操作示例
2019/05/28 PHP
一个简单的JavaScript数据缓存系统实现代码
2010/10/24 Javascript
jcarousellite.js 基于Jquery的图片无缝滚动插件
2010/12/30 Javascript
javascript hashtable 修正版 下载
2010/12/30 Javascript
js动态加载以及确定加载完成的代码
2011/07/31 Javascript
JS 打印功能代码可实现打印预览、打印设置等
2014/10/31 Javascript
js的window.showModalDialog及window.open用法实例分析
2015/01/29 Javascript
JS实现点击链接切换显示隐藏内容的方法
2017/10/19 Javascript
angular异步验证防抖踩坑实录
2019/12/01 Javascript
jquery向后台提交数组的代码分析
2020/02/20 jQuery
python zip文件 压缩
2008/12/24 Python
Win7上搭建Cocos2d-x 3.1.1开发环境
2014/07/03 Python
用Python进行基础的函数式编程的教程
2015/03/31 Python
Python使用matplotlib绘制随机漫步图
2018/08/27 Python
如何使用django的MTV开发模式返回一个网页
2019/07/22 Python
Python实现串口通信(pyserial)过程解析
2019/09/25 Python
Pycharm使用远程linux服务器conda/python环境在本地运行的方法(图解))
2019/12/09 Python
Python3如何实现Win10桌面自动切换
2020/08/11 Python
aden + anais英国官网:美国婴儿贴身用品品牌
2019/09/08 全球购物
Harman Audio官方商店:购买JBL、Harman Kardon、Infinity和AKG
2019/12/05 全球购物
什么是会话Bean
2015/05/14 面试题
中文专业毕业生自荐信
2013/10/28 职场文书
十月份红领巾广播稿
2014/01/22 职场文书
前厅部经理岗位职责范文
2014/02/04 职场文书
求职信名称怎么写
2014/05/26 职场文书
保洁公司服务承诺书
2014/05/28 职场文书
2014最新开业庆典策划方案(5篇)
2014/09/15 职场文书
统招统分证明
2015/06/23 职场文书
该怎么书写道歉信?
2019/07/03 职场文书
Idea连接MySQL数据库出现中文乱码的问题
2021/04/14 MySQL
Python 如何利用ffmpeg 处理视频素材
2021/11/27 Python