通过更改暗模式切换，我还想更改引导程序 class

Question

enter image description here of bootstrap I want to make a 'darkmode' toggle using the light mode /dark mode button.

<button type="button" class="btn btn-dark">Dark Mode</button>

press this button

class="btn btn-dark">  >>>  class="btn btn-light">

As the class changes

<script>
        function darkMode(){
            var body =document.body;
            body.classList.toggle("dark-mode");

            var button =document.getElementById("button");
            if(button.innerHTML == "Dark Mode"){
                button.innerHTML = "Light Mode"
            } else {
                button.innerHTML = "Dark Mode";
                button.innerText
            }
        }
    </script>

I've made it up to here.

I want to change the class in bootstrap, how do I do that?

Answer 1

You can use .className like you did before. For example:

function darkMode(){
    var body = document.body;
    body.classList.toggle("dark-mode");

    var button = document.getElementById("button");
    if(button.innerHTML == "Dark Mode"){
        button.innerHTML = "Light Mode";
        button.className = "btn btn-light";
    } else {
        button.innerHTML = "Dark Mode";
        button.className = "btn btn-dark";
    }
}

If this fixes your problem, you can mark it as correct.

Answer 2

If.toggle() is not working, can also use.addClass() and.removeClass(). Keep a boolean of the toggle value, remove the existing class, and add the class that corresponds to the boolean.