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 相关文章推荐
jquery validate使用攻略 第四步
Jul 01 Javascript
jQuery与ExtJS之选择实例分析
Aug 19 Javascript
jquery三个关闭弹出层的小示例
Nov 05 Javascript
JSON.parse()和JSON.stringify()使用介绍
Jun 20 Javascript
vuejs开发组件分享之H5图片上传、压缩及拍照旋转的问题处理
Mar 06 Javascript
JS实现下拉菜单列表与登录注册弹窗效果
Aug 10 Javascript
JS中Attr的用法详解
Oct 09 Javascript
JS实现键值对遍历json数组功能示例
May 30 Javascript
React-router4路由监听的实现
Aug 07 Javascript
Vue 表情包输入组件的实现代码
Jan 21 Javascript
JS数组进阶示例【数组的几种函数用法】
Jan 16 Javascript
代码解析React中setState同步和异步问题
Jun 03 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
多重?l件?合查?(一)
2006/10/09 PHP
php 中的4种标记风格介绍
2012/05/10 PHP
如何设置mysql允许外网访问
2013/06/04 PHP
php源码 fsockopen获取网页内容实例详解
2016/09/24 PHP
Yii2实现UploadedFile上传文件示例
2017/02/15 PHP
php的命名空间与自动加载实现方法
2019/08/25 PHP
jQuery+CSS3实现树叶飘落特效
2015/02/01 Javascript
JSON格式的时间/Date(2367828670431)/格式转为正常的年-月-日 格式的代码
2016/07/27 Javascript
JavaScript DOM节点操作方法总结
2016/08/23 Javascript
JS实现页面跳转参数不丢失的方法
2016/11/28 Javascript
防止重复发送 Ajax 请求
2017/02/15 Javascript
vue登录注册及token验证实现代码
2017/12/14 Javascript
jQuery第一次运行页面默认触发点击事件的实例
2018/01/10 jQuery
JavaScript实现一个简易的计算器实例代码
2018/05/10 Javascript
解决Nodejs全局安装模块后找不到命令的问题
2018/05/15 NodeJs
React中获取数据的3种方法及优缺点
2020/02/18 Javascript
javascript+css实现俄罗斯方块小游戏
2020/06/28 Javascript
vue 组件基础知识总结
2021/01/26 Vue.js
初步理解Python进程的信号通讯
2015/04/09 Python
Python实现以时间换空间的缓存替换算法
2016/02/19 Python
python编程实现归并排序
2017/04/14 Python
Python基础学习之常见的内建函数整理
2017/09/06 Python
使用Python 统计高频字数的方法
2019/01/31 Python
Python序列对象与String类型内置方法详解
2019/10/22 Python
python中return的返回和执行实例
2019/12/24 Python
python中scipy.stats产生随机数实例讲解
2021/02/19 Python
澳洲的服装老品牌:SABA
2018/02/06 全球购物
美国最大的在线寄售和旧货店:Swap.com
2018/08/27 全球购物
SQL Server笔试题
2012/01/10 面试题
大专生简历的自我评价
2013/11/26 职场文书
市场总经理岗位职责
2014/04/11 职场文书
乡镇党委书记个人整改措施
2014/09/15 职场文书
2015年政协委员工作总结
2015/05/20 职场文书
办公室日常管理制度
2015/08/04 职场文书
2016年学校爱国卫生月活动总结
2016/04/06 职场文书
SQL实现LeetCode(180.连续的数字)
2021/08/04 MySQL