用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 相关文章推荐
[原创]保存的js无法执行的解决办法
Feb 25 Javascript
判断用户的在线状态 onbeforeunload事件
Mar 05 Javascript
基于jQuery的前端数据通用验证库
Aug 08 Javascript
Jquery Uploadify上传带进度条的简单实例
Feb 12 Javascript
jQuery中关于ScrollableGridPlugin.js(固定表头)插件的使用逐步解析
Jul 17 Javascript
深入浅析JS Function()构造函数
Aug 22 Javascript
利用n工具轻松管理Node.js的版本
Apr 21 Javascript
AngularJS 教程及实例代码
Oct 23 Javascript
Angular PWA使用的Demo示例
Jan 31 Javascript
vue 插件的方法代码详解
Jun 06 Javascript
vue+elementUI实现图片上传功能
Aug 20 Javascript
layui 图片上传+表单提交+ Spring MVC的实例
Sep 21 Javascript
如何通过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检测url是否存在的方法
2015/04/14 PHP
Yii中创建自己的Widget实例
2016/01/05 PHP
初识PHP中的Swoole
2016/04/05 PHP
PHP7安装Redis扩展教程【Linux与Windows平台】
2016/09/30 PHP
iis 7下安装laravel 5.4环境的方法教程
2017/06/14 PHP
jquery prop的使用介绍及与attr的区别
2013/12/19 Javascript
js图片实时加载提供网页打开速度
2014/09/11 Javascript
jQuery插件scroll实现无缝滚动效果
2015/04/27 Javascript
JavaScript模拟可展开、拖动与关闭的聊天窗口实例
2015/05/12 Javascript
Bootstrap的图片轮播示例代码
2015/08/31 Javascript
js使用cookie记录用户名的方法
2015/11/26 Javascript
简单理解vue中实例属性vm.$els
2016/12/01 Javascript
Bootstrap表单使用方法详解
2017/02/17 Javascript
在node中使用jwt签发与验证token的方法
2019/04/03 Javascript
[37:45]2014 DOTA2国际邀请赛中国区预选赛5.21 DT VS Orenda
2014/05/22 DOTA
用Python写脚本,实现完全备份和增量备份的示例
2018/04/29 Python
python分数表示方式和写法
2019/06/26 Python
python 递归调用返回None的问题及解决方法
2020/03/16 Python
PyQt5.6+pycharm配置以及pyinstaller生成exe(小白教程)
2020/06/02 Python
简单介绍一下pyinstaller打包以及安全性的实现
2020/06/02 Python
Spring @Enable模块驱动原理及使用实例
2020/06/23 Python
UI自动化定位常用实现方法代码示例
2020/10/27 Python
自我鉴定范文300字
2013/10/01 职场文书
高校辅导员推荐信范文
2013/12/25 职场文书
初一英语教学反思
2014/01/11 职场文书
护理专业毕业生自荐书
2014/05/24 职场文书
大学同学会活动方案
2014/08/20 职场文书
工作作风懒散检讨书
2014/10/29 职场文书
交通事故一次性赔偿协议书范本
2014/11/02 职场文书
自查自纠整改报告
2014/11/06 职场文书
党支部先进事迹材料
2014/12/24 职场文书
投诉信范文
2015/07/02 职场文书
电工生产实习心得体会
2016/01/22 职场文书
一年级下册数学教学反思
2016/02/16 职场文书
Nginx性能优化之Gzip压缩设置详解(最大程度提高页面打开速度)
2022/02/12 Servers
Golang 实现 WebSockets 之创建 WebSockets
2022/04/24 Golang