通过js动态操作table(新增,删除相关列信息)


Posted in Javascript onMay 23, 2012

1、取得table对象
var objTable=document.getElementById( "tb_visitor" );
2、新增一行
var objTempRow = objTable.rows[0]; //取得模板行
var objNewRow = objTable.insertRow( objTable.rows.length );
objNewRow.id = objTable.rows.length-1;
//添加一行的相关信息?
for ( var i=0 ; i<objTempRow.cells.length ; i++ )
{
var objNewCell = objNewRow.insertCell( i );
objNewCell.innerHTML = objTempRow.cells[i].innerHTML;
//
if(objNewCell.innerHTML.indexOf("value=")!=-1){
var si=objNewCell.innerHTML.indexOf("value=")*1+6;
var ei=objNewCell.innerHTML.indexOf(">");
var cellvalue=objNewCell.innerHTML.substring(si,ei);
//将新列内容清空且变为可用状态
objNewCell.innerHTML=objNewCell.innerHTML.replace(cellvalue,'').replace('disabled','');
}
}
//添加行的click事件
objNewRow.onclick = new Function("fn_clickrow(this);");
3、删除一行
objTable.deleteRow(objrow.index);

Javascript 相关文章推荐
简单实用的全选反选按钮例子
Oct 18 Javascript
jQuery选择器源码解读(一):Sizzle方法
Mar 31 Javascript
JavaScript程序中实现继承特性的方式总结
Jun 24 Javascript
AngularJS指令用法详解
Nov 02 Javascript
js手机号4位显示空格,银行卡每4位显示空格效果
Mar 23 Javascript
ES6学习教程之对象的扩展详解
May 02 Javascript
基于原生js运动方式关键点的总结(推荐)
Oct 01 Javascript
Node.js搭建小程序后台服务
Jan 03 Javascript
Webpack 4如何动态切割JS注入文件名详解
Jul 09 Javascript
聊聊JS ES6中的解构
Apr 29 Javascript
JavaScript分页组件使用方法详解
Jul 26 Javascript
插件导致ECharts被全量引入的坑示例解析
Sep 23 Javascript
JavaScript基础语法让人疑惑的地方小结
May 23 #Javascript
利用javascript解决图片缩放及其优化的代码
May 23 #Javascript
JavaScript 图像动画的小demo
May 23 #Javascript
JavaScript学习笔记记录我的旅程
May 23 #Javascript
JS中处理与当前时间间隔的函数代码
May 23 #Javascript
自己做的模拟模态对话框实现代码
May 23 #Javascript
解决jquery的datepicker的本地化以及Today问题
May 23 #Javascript
You might like
php程序的国际化实现方法(利用gettext)
2011/08/14 PHP
php实现XSS安全过滤的方法
2015/07/29 PHP
php base64 编码与解码实例代码
2017/03/21 PHP
PHP迭代与递归实现无限级分类
2017/08/28 PHP
PHP chunk_split()函数讲解
2019/02/12 PHP
一个基于jquery的图片切换效果
2010/07/06 Javascript
Jquery attr(&quot;checked&quot;) 返回checked或undefined 获取选中失效
2013/10/10 Javascript
js动态往表格的td中添加图片并注册事件
2014/06/12 Javascript
详细介绍jQuery.outerWidth() 函数具体用法
2015/07/20 Javascript
JavaScript图片轮播代码分享
2015/07/31 Javascript
JavaScript中误用/g导致的正则test()无法正确重复执行的解决方案
2016/07/27 Javascript
JavaScript鼠标事件,点击鼠标右键,弹出div的简单实例
2016/08/03 Javascript
js实现文字向上轮播功能
2017/01/13 Javascript
js实现简单的计算器功能
2017/01/16 Javascript
jQuery实现大图轮播
2017/02/13 Javascript
Angular2 路由问题修复详解
2017/03/01 Javascript
详解Vue.js入门环境搭建
2017/03/17 Javascript
Easyui ueditor 整合解决不能编辑的问题(推荐)
2017/06/25 Javascript
Vue中添加手机验证码组件功能操作方法
2017/12/07 Javascript
vue+element导航栏高亮显示的解决方式
2019/11/12 Javascript
d3.js实现图形拖拽
2019/12/19 Javascript
解决vue的touchStart事件及click事件冲突问题
2020/07/21 Javascript
python使用配置文件过程详解
2019/12/28 Python
Python 读取位于包中的数据文件
2020/08/07 Python
Python confluent kafka客户端配置kerberos认证流程详解
2020/10/12 Python
家用个人磨皮机:Trophy Skin
2017/03/30 全球购物
花园仓库建筑:Garden Buildings Direct
2018/02/16 全球购物
德国在线订购鲜花:Fleurop
2018/08/25 全球购物
BLACKMORES澳洲官网:澳大利亚排名第一的保健品牌
2018/09/27 全球购物
新闻编辑自荐书范文
2014/02/12 职场文书
历史专业学生的自我评价
2014/02/28 职场文书
新农村建设典型材料
2014/05/31 职场文书
食品安全承诺书范文
2014/08/29 职场文书
2014年祖国生日寄语
2014/09/19 职场文书
乡领导班子四风问题对照检查材料
2014/09/25 职场文书
Nginx域名转发使用场景代码实例
2021/03/31 Servers