我该如何解决从函数内部调用函数的元素？

Question

I am trying this HTML code:

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

and script:

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

I am having a problem here setting the disabled state of the button that called the function. Can someone tell me how i can do this. I have tried two things but neither seem to work.

Answer 1

Pass in a reference to your button instead of just the name:

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

Answer 2

document.getElementById("buttonid1").disabled=false;