How to check whether checkbox element is checked or not by ID/name in Javascript?

You can check whether a given checkbox field is checked or not with Javascript by querySelector or getElementById method.

There are lots of ways to fetch Checked element results by native javascript.

Let’s give a code snippet for the Checkbox Element,

<div class="field choice">
    <input type="checkbox" name="show-password" title="Show Password" id="show-password" class="checkbox">
    <label for="show-password" class="label">Show Password</label>
  • Checkbox Element checked with querySelector method,
    let showPasswordField = document.querySelector("input[name=show-password]"); // BY Name Attribute
    let showPasswordField = document.querySelector("#show-password"); //By ID
    if (showPasswordField) {
     let result = showPasswordField.checked;
  • To Get Results by id attribute,
let showPasswordField = document.getElementById("show-password");
if (showPasswordField) {
    let isChecked = showPasswordField.checked;
  • To Get Results by name attribute,
    Here Checkbox field name attribute value is “show-password”,
let showPasswordField = document.getElementsByName("show-password");
if (showPasswordField.length !== 0) {
    let isChecked = showPasswordField[0].checked;
  • Using jQuery