用javascript删除当前行,添加行(示例代码)


Posted in Javascript onNovember 25, 2013

删除行

<script>   
  function   del(obj)   
  {   
        obj.parentNode.parentNode.removeNode(true);   
  }     
  </script>   
  <body>   
  <table>   
  <tr>
      <td>单元格1</td>
      <td><input   type=button   value="delete   this   row"   onclick="del(this)"></td>
   </tr>  
   <tr>
       <td>单元格2</td>
      <td><input   type=button   value="delete   this   row"   onclick="del(this)"></td>
   </tr> 
    <tr>
       <td>单元格3</td>
      <td><input   type=button   value="delete   this   row"   onclick="del(this)"></td>
   </tr> 
  </table>   
  </body>

添加行
<script> function uf_test(){
  //得到table对象
   var tbTable = document.getElementById("tb_test");
   //插入一行
   var trT = tbTable.insertRow();
   //得到上一行的td数
   var nRows = tbTable.rows[0].cells.length;
   //按上一行的td数循环进行插入td
   for(var i = 0; i < nRows ; i++){
    //创建td对象
    var tdT = document.createElement("TD");
    //给td对象赋值
    //tdT.innerHTML="sfsdf";  
    tdT.innerText="sfsdf"; 
    //把td添加到tr中 
    trT.appendChild(tdT);
   }
 }
</script>

<table id="tb_test" border="1">
 <tr>
 <td><input type="text"></td>
 </tr>
</table>
<input type="button" onclick="uf_test();" value="增加一行">
Javascript 相关文章推荐
JavaScript高级程序设计(第3版)学习笔记9 js函数(下)
Oct 11 Javascript
什么是MEAN?JavaScript编程中的MEAN是什么意思?
Dec 18 Javascript
jQuery实现对无序列表的排序功能(附demo源码下载)
Jun 25 Javascript
微信小程序之仿微信漂流瓶实例
Dec 09 Javascript
jQuery解析返回的xml和json方法详解
Jan 05 Javascript
Js apply方法详解
Feb 16 Javascript
vue中tab选项卡的实现思路
Nov 25 Javascript
this.$toast() 了解一下?
Apr 18 Javascript
JS定义函数的几种常用方法小结
May 23 Javascript
layui2.0使用table+laypage实现真分页
Jul 27 Javascript
Vue 监听元素前后变化值实例
Jul 29 Javascript
vue watch监控对象的简单方法示例
Jan 07 Vue.js
如何通过javascript操作web控件的自定义属性
Nov 25 #Javascript
利用js实现前台动态添加文本框,后台获取文本框内容(示例代码)
Nov 25 #Javascript
js导入导出excel(实例代码)
Nov 25 #Javascript
用javascript添加控件自定义属性解析
Nov 25 #Javascript
JavaScript/Js脚本处理html元素的自定义属性解析(亲测兼容Firefox与IE)
Nov 25 #Javascript
几种设置表单元素中文本输入框不可编辑的方法总结
Nov 25 #Javascript
js动态添加删除,后台取数据(示例代码)
Nov 25 #Javascript
You might like
php Smarty date_format [格式化时间日期]
2010/03/15 PHP
10个可以简化php开发过程的MySQL工具
2010/04/11 PHP
CURL的学习和应用(附多线程实现)
2013/06/03 PHP
php仿QQ验证码的实例分析
2013/07/01 PHP
php switch语句多个值匹配同一代码块的实现
2014/03/03 PHP
Yii2框架中一些折磨人的坑
2019/12/15 PHP
彪哥1.1(智能表格)提供下载
2006/09/07 Javascript
JQuery自定义事件的应用 JQuery最佳实践
2010/08/01 Javascript
详解JavaScript中undefined与null的区别
2014/03/29 Javascript
jquery实现图片左右切换的方法
2015/05/07 Javascript
JavaScript实现列表分页功能特效
2015/05/15 Javascript
vue.js入门教程之绑定class和style样式
2016/09/02 Javascript
Mongoose学习全面理解(推荐)
2017/01/21 Javascript
Vue-Router实现页面正在加载特效方法示例
2017/02/12 Javascript
angular或者js怎么确定选中ul中的哪几个li
2017/08/16 Javascript
用vue封装插件并发布到npm的方法步骤
2017/10/18 Javascript
脚手架vue-cli工程webpack的作用和特点
2018/09/29 Javascript
独立部署小程序基于nodejs的服务器过程详解
2019/06/24 NodeJs
python中私有函数调用方法解密
2016/04/29 Python
Python反射的用法实例分析
2018/02/11 Python
python实现多线程行情抓取工具的方法
2018/02/28 Python
python如何修改装饰器中参数
2018/03/20 Python
python实现简单的文字识别
2018/11/27 Python
Python中字符串与编码示例代码
2019/05/20 Python
tensorflow入门:tfrecord 和tf.data.TFRecordDataset的使用
2020/01/20 Python
Python性能测试工具Locust安装及使用
2020/12/01 Python
HTML5高仿微信聊天、微信聊天表情|对话框|编辑器功能
2018/04/23 HTML / CSS
Html5写一个简单的俄罗斯方块小游戏
2019/12/03 HTML / CSS
捷克家电和家具购物网站:OKAY.cz
2020/07/23 全球购物
工艺工程师工作职责
2013/11/23 职场文书
电子商务专业求职信
2014/03/08 职场文书
简洁的英文求职信范文
2014/05/03 职场文书
2014年汽车销售工作总结
2014/12/01 职场文书
文言文辞职信
2015/02/28 职场文书
2016年“七一建党节”广播稿
2015/12/18 职场文书
mongodb的安装和开机自启动详细讲解
2021/08/02 MongoDB