JS动态增删表格行的方法


Posted in Javascript onMarch 03, 2016

本文实例讲述了JS动态增删表格行的方法。分享给大家供大家参考,具体如下:

function insertRow(tableName,className,bgcolor, cellContentArray){
 var t = document.getElementByIdx(tableName); //取得table表
 var tr = t.insertRow();  //插入一行
 tr.className=className;  //设置行的css
 tr.bgcolor=bgcolor;   //设置行的背景颜色
 for( var i=0;i<cellContentArray.length;i++){
 var td = tr.insertCell(); //插入一列
 td.innerHTML=cellContentArray[i]; //设置列内容
 }
}
function deleteRow(tableName,btn){
 var t = document.getElementByIdx(tableName); //取得table表
 var tr = btn.parentNode.parentNode; //取得对应的行
 t.deleteRow(tr.rowIndex);
}

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

Javascript 相关文章推荐
JQuery 无废话系列教程(一) jquery入门 [推荐]
Jun 23 Javascript
javascript的原生方法获取数组中的最大(最小)值
Dec 19 Javascript
详解js实现线段交点的三种算法
Aug 09 Javascript
angularjs实现文字上下无缝滚动特效代码
Sep 04 Javascript
关于javascript事件响应的基础语法总结(必看篇)
Dec 26 Javascript
js实现图片360度旋转
Jan 22 Javascript
js实现带三角符的手风琴效果
Mar 01 Javascript
vue-cli的eslint相关用法
Sep 29 Javascript
Vue.js的复用组件开发流程完整记录
Nov 29 Javascript
JS实现的贪吃蛇游戏案例详解
May 01 Javascript
原生Vue 实现右键菜单组件功能
Dec 16 Javascript
如何理解Vue前后端数据交互与显示
May 10 Vue.js
微信jssdk在iframe页面失效问题的解决措施
Mar 03 #Javascript
基于javascript html5实现多文件上传
Mar 03 #Javascript
编写高质量JavaScript代码的基本要点
Mar 02 #Javascript
JS获取当前脚本文件的绝对路径
Mar 02 #Javascript
Webpack 实现 AngularJS 的延迟加载
Mar 02 #Javascript
浅谈JS原型对象和原型链
Mar 02 #Javascript
jquery单击事件和双击事件冲突解决方案
Mar 02 #Javascript
You might like
PHP使用者状态管理功能的应用
2006/10/09 PHP
php split汉字
2009/06/05 PHP
PHP面向对象程序设计之类与反射API详解
2016/12/02 PHP
理解Javascript_07_理解instanceof实现原理
2010/10/15 Javascript
基于Jquery的开发个代阴影的对话框效果代码
2011/07/28 Javascript
在javascript中对于DOM的加强
2013/04/11 Javascript
Javascript 多物体运动的实现
2014/12/24 Javascript
js实现头像图片切割缩放及无刷新上传图片的方法
2015/07/17 Javascript
JS清除文本框内容离开在恢复及鼠标离开文本框时触发js的方法
2016/01/12 Javascript
require.js配合插件text.js实现最简单的单页应用程序
2016/07/12 Javascript
全面解析JavaScript中“&amp;&amp;”和“||”操作符(总结篇)
2016/07/18 Javascript
JavaScript面试开发常用的知识点总结
2016/08/08 Javascript
WebPack基础知识详解
2017/01/16 Javascript
漂亮实用的页面loading(加载)封装代码
2017/02/03 Javascript
vue-awesome-swiper滑块插件使用方法详解
2017/11/27 Javascript
Vue Socket.io源码解读
2018/02/07 Javascript
vue.js过滤器+ajax实现事件监听及后台php数据交互实例
2018/05/22 Javascript
bootstrap table表格插件之服务器端分页实例代码
2018/09/12 Javascript
详解Axios 如何取消已发送的请求
2018/10/20 Javascript
vue 使用 sortable 实现 el-table 拖拽排序功能
2020/12/26 Vue.js
[01:00:54]TI4正赛第二日开场
2014/07/20 DOTA
Python的动态重新封装的教程
2015/04/11 Python
Python中字符串对齐方法介绍
2015/05/21 Python
在python3环境下的Django中使用MySQL数据库的实例
2017/08/29 Python
python组合无重复三位数的实例
2018/11/13 Python
Python如何实现强制数据类型转换
2019/11/22 Python
Visual Studio Code搭建django项目的方法步骤
2020/09/17 Python
使用CSS3制作一个简单的进度条(demo)
2017/05/23 HTML / CSS
canvas压缩图片以及卡片制作的方法示例
2018/12/04 HTML / CSS
加拿大购物频道:The Shopping Channel
2016/07/21 全球购物
UGG雪地靴荷兰官网:UGG荷兰
2016/09/09 全球购物
生产车间实习自我鉴定
2013/09/23 职场文书
愚人节活动策划方案
2014/03/11 职场文书
关于护士节的演讲稿
2014/05/26 职场文书
房屋所有权证明
2014/10/20 职场文书
员工离职感谢信
2015/01/22 职场文书