JavaScriptでチェックボックスの値を取得・設定する完全ガイド

    <div id="checkboxStatus">チェックされている項目: なし</div>
    <input type="checkbox" id="checkbox1"> チェックボックス1<br>
    <input type="checkbox" id="checkbox2"> チェックボックス2<br>
    <input type="checkbox" id="checkbox3"> チェックボックス3<br>

    <button onclick="checkCheckboxes()">チェックボックスの状態をチェック</button>

// チェックボックスの状態をチェックする関数
function checkCheckboxes() {
    var checkBox1 = document.getElementById("checkbox1");
    var checkBox2 = document.getElementById("checkbox2");
    var checkBox3 = document.getElementById("checkbox3");
    var statusDiv = document.getElementById("checkboxStatus");

    var checkedBoxes = [];
    if (checkBox1.checked) {
        checkedBoxes.push("チェックボックス1");
    }
    if (checkBox2.checked) {
        checkedBoxes.push("チェックボックス2");
    }
    if (checkBox3.checked) {
        checkedBoxes.push("チェックボックス3");
    }

    if (checkedBoxes.length > 0) {
        statusDiv.textContent = "チェックされている項目: " + checkedBoxes.join("と");
    } else {
        statusDiv.textContent = "チェックされている項目: なし";
    }
}