así que estoy tratando de hacer un proyecto que encontré en https://jsbeginners.com/hex-change-background-color-project/ donde tengo un botón y cuando se hace clic, cambia el color del fondo acompañado de un código hexadecimal para el color. He visto algunas soluciones, pero me pregunto por qué la mía no funciona.
JavaScript:
const colors = ['#C78283;', '#B80C09;', '#6B2B06;', '#E5E7E6;', '#B7B5B3;', '#CBE896;', '#FFFFFC;', '#FF7F11;', '#FF1B1C;', '#493657;', '#CE7DA5;', '#BEE5BF;', '#DFF3E3;', '#FFD1BA;', '#EF233C;', '#FCAF58;', '#FF8C42;', '#F4B860;']; btn.addEventListener('click', ()=> { span.innerText= colors[Math.floor(Math.random() *colors.length)]; document.body.style.background.color = colors.values; });todo funciona, incluido el intervalo que cambia a un código hexadecimal aleatorio de la matriz, excepto el color de fondo, no cambia. alguien puede ayudar?
Problemas.
; en la lista de colores.colors.values es incorrecto. colors es una matriz. Así que tienes que acceder usando el índice correctodocument.body.style.backgroundColorHe redefinido el código manteniendo el color aleatorio en una cadena y configurando el mismo valor para abarcar el contenido y el color de fondo.
const btn = document.getElementById('btn'); const span = document.getElementById('hex'); const colors = ['#C78283', '#B80C09', '#6B2B06', '#E5E7E6', '#B7B5B3', '#CBE896', '#FFFFFC', '#FF7F11', '#FF1B1C', '#493657', '#CE7DA5', '#BEE5BF', '#DFF3E3', '#FFD1BA', '#EF233C', '#FCAF58', '#FF8C42', '#F4B860']; btn.addEventListener('click', () => { const color = colors[Math.floor(Math.random() * colors.length)]; span.innerText = color; document.body.style.backgroundColor = color; }); <button id="btn">Click Me</button> <span id="hex"></span>