用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中使用replaceAll()函数实现字符替换的方法
Dec 25 Javascript
javascript的 {} 语句块详解
Feb 27 Javascript
JavaScript数组合并的多种方法
May 22 Javascript
微信小程序 绘图之饼图实现
Oct 24 Javascript
详解微信小程序 wx.uploadFile 的编码坑
Jan 23 Javascript
jquery实现tab选项卡切换效果(悬停、下方横线动画位移)
May 05 jQuery
vue 将页面公用的头部组件化的方法
Dec 18 Javascript
JavaScript引用类型之基本包装类型实例分析【Boolean、Number和String】
Aug 09 Javascript
js中call()和apply()改变指针问题的讲解
Jan 17 Javascript
小程序自定义导航栏兼容适配所有机型(附完整案例)
Apr 26 Javascript
vue实现井字棋游戏
Sep 29 Javascript
swiper4实现移动端导航栏tab滑动切换
Oct 16 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
如何给phpadmin一个保护
2006/10/09 PHP
动易数据转成dedecms的php程序
2007/04/07 PHP
php去除重复字的实现代码
2011/09/16 PHP
PHP读取txt文本文件并分页显示的方法
2015/03/11 PHP
php 自定义错误日志实例详解
2016/11/12 PHP
抽出www.templatemonster.com的鼠标悬停加载大图模板的代码
2007/07/11 Javascript
javascript 类方法定义还是有点区别
2009/04/15 Javascript
javascript 学习笔记(一)DOM基本操作
2011/04/08 Javascript
获取数组中最大最小值方法js代码(自写)
2013/08/12 Javascript
javascript实现动态模态绑定grid过程代码
2014/09/22 Javascript
异步JS框架的作用以及实现方法
2015/10/29 Javascript
JavaScript使用forEach()与jQuery使用each遍历数组时return false 的区别
2016/08/26 Javascript
jQuery is not defined 错误原因与解决方法小结
2017/03/19 Javascript
Vue2.0使用过程常见的一些问题总结学习
2017/04/10 Javascript
EasyUI的DataGrid绑定Json数据源的示例代码
2017/12/16 Javascript
js保留两位小数方法总结
2018/01/31 Javascript
JavaScript实现读取与输出XML文件数据的方法示例
2018/06/05 Javascript
Vue实现一个无限加载列表功能
2018/11/13 Javascript
layui数据表格跨行自动合并的例子
2019/09/02 Javascript
vuex+axios+element-ui实现页面请求loading操作示例
2020/02/02 Javascript
Webpack的Loader和Plugin的区别
2020/11/09 Javascript
[02:20]DOTA2亚洲邀请赛 IG战队出场宣传片
2015/02/07 DOTA
django manage.py扩展自定义命令方法
2018/05/27 Python
Jupyter notebook在mac:linux上的配置和远程访问的方法
2019/01/14 Python
python cumsum函数的具体使用
2019/07/29 Python
python 中xpath爬虫实例详解
2019/08/26 Python
python统计字符串中字母出现次数代码实例
2020/03/02 Python
python为QT程序添加图标的方法详解
2020/03/09 Python
tensorflow安装成功import tensorflow 出现问题
2020/04/16 Python
DC Shoes官网:美国滑板鞋和服饰品牌
2017/09/03 全球购物
荷兰在线钓鱼商店:Raven
2019/06/26 全球购物
如何防止同一个帐户被多人同时登录
2013/08/01 面试题
《白鹅》教学反思
2014/04/13 职场文书
关于感恩的演讲稿800字
2014/08/26 职场文书
实习生矿工检讨书
2014/10/13 职场文书
检查机关领导群众路线教育实践活动个人整改措施
2014/10/28 职场文书