How do i check to see if the checkbox is checked?

Question

I want to implement a dark mode in my website. I have a switch with a checkbox input and I want to run a javascript function when it is checked so that the colors change. Here is the html code. I don't know if the CSS code is needed for this.

<label class="switch">
<input type="checkbox" id="darkmode">
<span class="slider round"></span>
</label>

document.getElementById('darkmode').checked //(true or false); document.getElementById('darkmode').onchange = function() { if (this.checked) f(); else f2(); }; — Anthony McGrath, Mar 31 '20 at 01:38
`if(Element.checked){ /* element is checked */ } else{ /* not checked */ }` — StackSlave, Mar 31 '20 at 01:38

score 1 · Accepted Answer · answered Mar 31 '20 at 01:55

1

var checkbox = document.getElementById("darkmode");

checkbox.addEventListener( 'change', function() {
    if(this.checked) {
        // Enable dark mode
    } else {
        // Disable dark mode
    }
});

answered Mar 31 '20 at 01:55

jcoleau

1,112
7
20

this worked thank you! – Linder Leiva Mar 31 '20 at 02:10

score 0 · Answer 2 · answered Mar 31 '20 at 01:45

function check() {
 var check=   document.getElementById("darkmode").checked;
 
 console.log(check);
}

<label class="switch">
<input type="checkbox" id="darkmode" >
<span class="slider round"></span>
<button onclick='check()'>press</button>
</label>

How do i check to see if the checkbox is checked?

2 Answers2