使用querySelector获取表行的索引？

Question

目前我可以在table row内删除#myTable的第一次出现，但如何在rowIndex内确定其#myTable？

http://jsfiddle.net/bobbyrne01/fmj6np6m/1/

html ..

<table id="otherTable"></table>
<table id="myTable"></table>

js ..

for (var i = 0; i < 10; i++) {
    var table = document.getElementById("myTable"),
        row = table.insertRow(table.rows.length),
        cell0 = row.insertCell(0),
        cell1 = row.insertCell(1),
        cell2 = row.insertCell(2);

    var dirText = document.createTextNode('1');
    cell0.appendChild(dirText);

    var filenameText = document.createTextNode('1');
    cell1.appendChild(filenameText);
}

for (var l = 0; l < document.getElementById('myTable').rows.length; l++) {
    document.getElementById('myTable').rows[l].className = 'none';
}

document.getElementById('myTable').rows[2].className = 'showRow';
alert(document.querySelector('#myTable tr.showRow'));

css ..

.none {
    display: none;
}
.showRow {
    display: table-row;
}

Answer 1

如果您想知道与选择器匹配的第一行的行索引，可以使用

table.rows.length-1 - document.querySelectorAll(selector + ' ~ tr').length;

更一般地说，如果你想获得任意行的行索引，

[].indexOf.call(table.rows, row);

在你的情况下，

table.rows.length-1
  - document.querySelectorAll('#myTable tr.showRow ~ tr').length;
[].indexOf.call(table.rows, document.querySelector('#myTable tr.showRow'));