如何为单个表格单元格制作事件侦听器（onclick）

Question

my question is: How can I make a table cell, for example, change text on click? I tried this:

 function randomFunction() { document.getElementById("randomId").innerText = "random text" }

 <table> <tr> <td id="randomId" onclick="randomFunction()">random text</td> </tr> </table>

but it does the onclick attribute for the entire row.

Is it possible to trigger the function only when I click on the cell ?

Answer 1

Yes it possible. you have pass the context to the function. I put more cells in your table.

 function randomFunction(e){ e.innerText = "HuhU" // document.getElementById("randomId").innerText = "random text!" }

 td { background: green; color:white; }

 <table> <tr> <td id="randomId" onclick="randomFunction(this)">random text</td> <td id="randomId" onclick="randomFunction(this)">random text</td> <td id="randomId" onclick="randomFunction(this)">random text</td> </tr> </table>