¡Lo he logrado!
Sí, si coloco un alerta dentro de la función cambiar, lo reconocía, pero es como si las variables dentro de la función estuvieran fuera de su ámbito, cosa que no acabo de entender. Si dentro del alert pongo, por ejemplo, el mensaje (botones[1]) se muestra el texto 'undefined' en la alerta.
En Chrome puse un breakpoint dentro de la función, y al evaluar las variables en la cónsola, devuelve ésto:
botones: MouseEvent
botones[x]:<not avalable>
x: <not avalable>
Pero también me dio una pista que no sabría explicar ahora y se me ocurrió sustituir dentro de la función la referencia
botones[x] con
this . ¡y funcionó!
Así que la mejoré para que al salir el ratón del elemento elimine la clase sombra. El resultado es éste, por si sirve a alguien:
Código Javascript
:
Ver originalfunction iniciar(){
var botones, x
botones=document.querySelectorAll('#barra ul li');
for(x = 0; x < botones.length; x++){
botones[x].addEventListener('mouseover',cambiar)
botones[x].addEventListener('mouseout',volver)
function cambiar(botones){
this.className='sombra'
};
};
function volver(botones){
this.className='null'
};
};
addEventListener('load', iniciar);
Yve - Muy contenta con el resultado :)
Gracias jluishg por la paciencia.