网页table如何获取每行的索引

方式1：rowIndex

rowIndex 从 0 开始

function onClick() {
  //获取到tr节点的索引（我这里需要向上获取2次父节
  alert(this.parentNode.parentNode.rowIndex);点）
}

方式2：sectionRowIndex

sectionRowIndex 从 1 开始

    function onDeleteClick() {
        alert(this.parentNode.parentNode.sectionRowIndex)
    }

方式3：selectedIndex

这种方式稍微麻烦，selectedIndex只起到一个保存数据的作用，但是好处是 不用寻找父节点，selectedIndex 可以设置为任意我们需要的数据（比如做分页时可以存入分页之后的索引），不仅仅可以用来表示索引。

let bu = document.createElement("button");//创建button
bu.selectedIndex = index;//设置索引
bu.onclick = onClick;
 //省略把这个button插入到tr中的代码

function onClick() {
  alert(this.selectedIndex);//获取到索引
}

方式4：数据绑定

这种方式与方式3有相似之处，但是可以绑定多个字符串形式的数据，在网页源代码里可以看到如下H5代码：
点我
这种方式是通过增加data-xxx形式的标签来保存数据的，如果不介意在网页源代码里可以看到数据可以用这种方法。

let bu = document.createElement("button");//创建button
bu.setAttribute("data-index", i);//设置索引
bu.setAttribute("data-id", 3);//设置id
bu.onclick = onClick;
...
 //省略把这个button插入到tr中的代码

function onClick() {
let index = this.getAttribute("data-index");//获取到索引
let id = this.getAttribute("data-id");//获取到id
  alert(index);
}