javascript - 如何寻址从函数内部调用函数的元素？

Question

我正在尝试这个 HTML 代码:

<button name="darkBlue" onclick="setThemeColor(this.name)">Blue</button>
<button name="black" onclick="setThemeColor(this.name)">Black</button>

和脚本:

function setThemeColor(buttonName) {
    localStorage.themeColor = buttonName;
    document.getElementsByTagName('html')[0].className = buttonName
    var themeButtons = document.querySelectorAll(".theme");
    for (var button in themeButtons) {
        themeButtons[button].disabled = false;
    }
    // this.disabled = false;
    // element.setAttribute("disabled", "disabled");
}

我在设置调用该函数的按钮的禁用状态时遇到问题。有人可以告诉我该怎么做吗？我尝试了两种方法，但似乎都不起作用。

Answer 1

传入对按钮的引用，而不仅仅是名称:

HTML

<button name="darkBlue" onclick="setThemeColor(this)">Blue</button>
<button name="black" onclick="setThemeColor(this)">Black</button>

JS

function setThemeColor(button) {
    localStorage.themeColor = button.name;
    document.getElementsByTagName('html')[0].className = button.name;
    var themeButtons = document.querySelectorAll(".theme");
    for (var button in themeButtons) {
        themeButtons[button].setAttribute("disabled", "disabled");
    }
    button.setAttribute("disabled", "disabled");
}