Este es mi código.
var hitButton = document.querySelector('.btn-hit'); var scoreResults = document.querySelectorAll(".flex-blackjack-row-1 h3"); var scores = document.querySelector(".flex-blackjack-row-1 span"); const config = {childList: true}; const bustedMessage = document.createElement('h2'); bustedMessage.textContent = 'BUSTED!'; const busted = function (mutationList, observer){ if (parseInt(scores.textContent) > 21) { console.log(scores.textContent) scoreResults[0].before(bustedMessage); hitButton.setAttribute('disabled', 'true'); } } const observer = new MutationObserver(busted); observer.observe(scores, config);En esa función de devolución de llamada llamada "busted", estoy agregando un atributo a "hitButton". Pero cuando trato de actualizarlo así en otra función
hitButton.setAttribute('disabled', 'false');no se esta actualizando.
Pero puedo eliminar ese atributo usando
hitButton.removeAttribute('disabled');Eliminar ese atributo es hacer lo que quiero hacer. Pero ahora necesito saber, ¿por qué no puedo actualizarlo en lugar de eliminarlo?
Porque estos atributos en las etiquetas HTML son solo atributos booleanos. Digamos, por ejemplo, si el atributo "deshabilitado" está presente, le dice al navegador que lo deshabilite independientemente del valor que le esté configurando.
"marcado", "deshabilitado", "seleccionado", "silenciado", "reproducción automática", "bucle", "controles" son algunos de los atributos booleanos en HTML.
Google "Atributos booleanos en HTML". Aprenderás más al respecto. Espero que responda a tu pregunta.