html table tbody deleteRow有残留?

html table tbody deleteRow有残留?

问题描述:这个问题描述的是在使用 HTML 的 deleteRow 方法从一个 tabletbody 中删除行时,表格中仍然存在某些行。

参考方法1:表格移除多行的时候, 移除行数字索引顺序要从大到小, 而不能从小到大。

参考代码如下:

javascript 复制代码
    function _updateTable () {
      const _billPageTableId = 'bill_data_table';
      const _billPageTableRowTag = 'billPageTr';
      let tableElement = document.getElementById(_billPageTableId).getElementsByTagName('tbody')[0];

      /** 移除旧的tr列表 ( 注: 表格移除多行的时候, 移除行数字索引顺序要从大到小, 而不能从小到大 ) 。 */
      var elements = document.getElementsByClassName(_billPageTableRowTag);
      // console.log('elements.length', elements.length);
      for (let i = elements.length - 1; i >= 0; i--) {
        // elements[i].parentNode.removeChild(elements[i]);
        document.getElementById('bill_data_table').deleteRow(i);
      }

      /** TODO: 添加新的tr列表。 */
    }
相关推荐
excel几秒前
Vue 模板编译中的资源路径转换:transformSrcset 深度解析
前端
excel8 分钟前
Vue 工具函数源码解析:URL 解析与分类逻辑详解
前端
excel11 分钟前
Vue SFC 样式预处理器(Style Preprocessor)源码解析
前端
excel12 分钟前
深度解析:Vue Scoped 样式编译原理 —— vue-sfc-scoped 插件源码详解
前端
excel14 分钟前
Vue SFC Trim 插件源码解析:自动清理多余空白的 PostCSS 实现
前端
excel18 分钟前
Vue SFC 样式变量机制源码深度解析:cssVarsPlugin 与编译流程
前端
excel20 分钟前
🧩 Vue 编译工具中的实用函数模块解析
前端
excel24 分钟前
🧩 深入剖析 Vue 编译器中的 TypeScript 类型系统(第五篇)
前端
excel30 分钟前
🧩 深入剖析 Vue 编译器中的 TypeScript 类型系统(第六篇 · 终篇)
前端
不吃香菜的猪33 分钟前
el-upload实现文件上传预览
前端·javascript·vue.js