"單擊 HTML 表格並獲取行號（使用 Javascript，而不是 jQuery）"

Question

我想知道如何單擊 HTML 表格中的按鈕並獲取返回給我的行號和列號：例如，使用下表：

<table>
  <tr>
    <td><input type="button" value="button"></td>
    <td><input type="button" value="button"></td>
    <td><input type="button" value="button"></td>
    </tr>
    <tr>
    <td><input type="button" value="button"></td>
    <td><input type="button" value="button"></td>
    <td><input type="button" value="button"></td>
    </tr>
    <tr>
    <td><input type="button" value="button"></td>
    <td><input type="button" value="button"></td>
    <td><input type="button" value="button"></td>
    </tr>
  </table>

Answer 1

嘗試這個：

 function getId(element) { alert("row" + element.parentNode.parentNode.rowIndex + " - column" + element.parentNode.cellIndex); }

 <table> <tr> <td><input type="button" value="button" onclick="getId(this)"></td> <td><input type="button" value="button" onclick="getId(this)"></td> <td><input type="button" value="button" onclick="getId(this)"></td> </tr> <tr> <td><input type="button" value="button" onclick="getId(this)"></td> <td><input type="button" value="button" onclick="getId(this)"></td> <td><input type="button" value="button" onclick="getId(this)"></td> </tr> <tr> <td><input type="button" value="button" onclick="getId(this)"></td> <td><input type="button" value="button" onclick="getId(this)"></td> <td><input type="button" value="button" onclick="getId(this)"></td> </tr> </table>

Answer 2

@Gremash js 函數的最通用版本

function  getId(element) {
    alert("row" + element.closest('tr').rowIndex + 
    " -column" + element.closest('td').cellIndex);
}

Answer 3

試試這個代碼： alert(document.getElementById("yourTableId").childNodes[1].childElementCount);

"