0
401
Views¿Hay otra forma de obtener las propiedades de la celda en JS y luego event.target.nodeName.toLowerCase()?
entonces tengo este problema que quiero comparar 2 celdas de la tabla de ajedrez que hice. Cuando hago clic en la celda, entro en console.log solo td, y la comparación que estoy usando tengo la celda en sí (agregué una foto, por ejemplo), por lo que hay otra forma de obtener las propiedades de la celda cuando hago clic en ella. entonces event.target.nodeName.toLowerCase() ?
aquí en esta función estoy enviando celda e intento compararla con event.target.nodeName.toLowerCase() el problema es que en event.target.nodeName.toLowerCase() tengo "td" y no la "celda" como se muestra en el lado derecho de la foto, así que quiero saber si hay otra opción cuando hago clic en alguna celda de la cuadrícula (mesa de ajedrez) para que pueda comparar la celda.
const handler= Click.bind(null, cell); table.addEventListener("click", handler); function Click(cell, event) { if (event.target.nodeName.toLowerCase() === 'td' ) { event.target.style.backgroundColor = "blue"; if (event.target.nodeName.toLowerCase() == cell]) { alert("SOMETEXT") } } }1 answers
Answer question0
Puede obtener las clases de elementos de destino con<Element>.classList y luego verificar si es una celda blanca o negra según su clase.
<DOMTokenList>.contains es uno de los métodos que puede usar para verificar si el elemento tiene una clase específica de una manera moderna, gracias a @CerebralFart y @Bergi .
document.onclick = e => { const cell = e.target.classList.contains('blackcell') ? 'black' : 'white'; console.log(cell); } <table> <tr> <td class="cell blackcell">B</td> <td class="cell whitecell">W</td> <td class="cell whitecell">W</td> <td class="cell blackcell">B</td> <td class="cell blackcell">B</td> </tr> </table>