打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
table下删除tr的小技巧



 今天需要解决一个问题,一个表格里面有好多行数据(好多个tr),每一行数据里面有一个删除的链接,点击删除的时候可以删除所点击的那一行(也就是tr),网络上搜索了一下,都是用一个函数遍历索引或者传索引进去删除,个人感觉麻烦,就偷懒用了下其他写法,代码如下:
  <table border="1">
      <tr>
          <th>内容</th>
          <th>删除</th>
      </tr>
      <tr>
          <td>test1</td>
  <td>
              <a href="#" onclick="this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode)">删除</a>             </td>
      </tr>
   </table>
  this=>就是本对象的意思,也就是a这个标签。
  parentNode=>对象的父节点,这里面就是a标签的父节点,也就是td。
  this.parentNode.parentNode.parentNode这里面可以这么推:
  this.parentNode=td;this.parentNode.parentNode=td.parentNode=tr;
  this.parentNode.parentNode.parentNode=td.parentNode.parentNode=tr.parentNode=table。
  removeChild=>移除孩子结点。
  归纳一下就是table.removeChild(tr);这里面的tr就是我们所点击这一行,为什么是我们所点击这一行呢?因为this代表本对象,就是我们所点击的。
  
本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
javascript子级对象获得父级对象属性
得到行对象,根据得到的行对象得到所在的行数,删除行
如何通过js获取表单对象?
bootstrap 响应式表格
HTML <table> 标签
bootstrap表格
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服