Javascript setAttribute 无法更新属性值

Question

这是我的代码。

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);

在名为“busted”的回调函数中，我向“hitButton”添加一个属性。但是当我尝试在另一个函数中像这样更新它时

hitButton.setAttribute('disabled', 'false');

它没有被更新。

但我可以使用

删除该属性

hitButton.removeAttribute('disabled');

删除那个属性就是我想做的。但现在我需要知道，为什么我不能更新它而不是删除它？

Answer 1

因为，HTML标签中的这些属性只是布尔属性。例如，如果存在“已禁用”属性，它会告诉浏览器禁用它，而不管您为其设置的值如何。

“选中”、“禁用”、“选中”、“静音”、“自动播放”、“循环”、“控件”是 HTML 中的一些布尔属性。

Google“HTML 中的布尔属性”。您将了解更多。希望它能回答你的问题。

Javascript setAttribute 无法更新属性值

Javascript setAttribute is not working to update attribute's value

javascript

callback

setattribute