Fare clic su tabella HTML e ottenere il numero di riga (con javascript, non jquery)

Question

Vorrei sapere come fare clic su un pulsante in una tabella HTML e ottenere il numero di riga e colonna restituito a me: Ad esempio, con il seguente tabella:

<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> 

Come vorrei utilizzare JavaScript per fare clic sul primo pulsante in seconda fila e lo hanno mi dicono che ho cliccato sulla prima cella in seconda fila? Ogni pulsante deve avere un ID univoco o no?

Answer 1

Prova questo:

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

versione più generica di @Gremash js funzione

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