hola, tenía una pregunta sobre cómo puedo enviar un valor desde una etiqueta, excepto las entradas. a una función javascript para ser identificado...
por ejemplo, quiero hacer clic en una etiqueta tr en la tabla (en la pantalla) y luego enviar un valor o nombre o algo así a una función y luego la función comienza a identificar el valor o los datos de la etiqueta... por ejemplo, si el nombre de la etiqueta o los datos de la etiqueta o el valor de la etiqueta era "tag1", ejecuta una función. Busqué antes y vi que muchas personas usan data-id, pero no sé si funciona para mí o no ... entonces, ¿cómo puedo usarlo?
<html> <head> <title>JavaScript</title> <link href="style.css" rel="stylesheet"> </head> <body> <table> <tr> <td data-id = "td1" id = "td1" > </td> <td id = "td2" > </td> <td id = "td3" > </td> </tr> <tr> <td id = "td4" > </td> <td id = "td5" > </td> <td id = "td6" > </td> </tr> <tr> <td id = "td7" > </td> <td id = "td8" > </td> <td id = "td9" > </td> </tr> </table> <script> function clicked(){ let x = document.getElementById("td1").getAttribute("onclick") } </script> </body> </html>aquí está el código css:
* { margin: 0px; padding: 0px; } table { width: 200px; height: 200px; border:1px solid black; } table td { border:1px solid black; }Te doy un ejemplo para tu referencia:
let allTrs = document.getElementsByTagName('tr'); for (let i =0;i<allTrs.length;i++){ allTrs[i].addEventListener("click",()=>{hello(allTrs[i])}); } function hello(row){ let cellList=row.cells; for (let i=0;i<cellList.length;i++){ console.log("id="+cellList[i].id); console.log("data-id="+cellList[i].getAttribute('data-id')); console.log("text content="+cellList[i].textContent); console.log("======================================="); } } * { margin: 0px; padding: 0px; } table { width: 200px; height: 200px; border:1px solid black; } table td { border:1px solid black; } <table> <tr> <td data-id="td1" id="td1"> 1 </td> <td id="td2"> 2 </td> <td id="td3"> 3 </td> </tr> <tr> <td id="td4"> 4 </td> <td id="td5"> 5 </td> <td id="td6"> 6 </td> </tr> <tr> <td id="td7"> 7 </td> <td id="td8"> 8 </td> <td id="td9"> 9 </td> </tr> </table>