0

Con este poco codigo que tengo, estaba intentando cambiar el valor de CSS a un div llamado td en su class, un mouseover que redirige a cambiarCSS y lo que se puede leer dentro. Este recogelos datos que yo quiero que coga en el console.log lo he comprobado, pero a pesar de que parece que todo es correcto, ponga la funcion que ponga me devuelve todo el rato esto: Uncaught TypeError: Cannot read properties of undefined (reading 'remove') at cambiarCSS.

El codigo es el siguiente:

HTML

<div class="td" onmouseover="cambiarCSS()">fsdghsdfdf</div>

JS

function cambiarCSS(){

        var button = document.querySelectorAll(".td");
        console.log(button);
        button.classList.remove("td");
        button.classList.add("tdHover");

    };

Muchas gracias a todos de antemano!!

2 respuestas 2

3

Si no quieres utilizar un id para identificar al div, y quieres tener más div con esa clase (.td), tienes que tener en cuenta que querySelectorAll() devuelve un NodeList que es no es un arreglo pero si es iterable, con esto puedes hacer algo como:

function cambiarCSS(){
  var buttons = document.querySelectorAll(".td");
  for (var i = 0; i < buttons.length; i++) {
    buttons[i].classList.remove("td");
    buttons[i].classList.add("tdhover")
  }
}
<div class="td" onmouseover="cambiarCSS()">fsdghsdfdf</div>

1

para cambiar la clase deberías usar un id por ejemplo

<div class="td" id="td" onmouseover="cambiarCSS()">fsdghsdfdf</div>

y ya con el ID ya funcionaria tu js

function cambiarCSS(){

    var button = document.getElementById("td");
    console.log(button);
    button.classList.remove("td");
    button.classList.add("tdHover");

};

Espero que te ayude saludos.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.