如何在WebGrid中查找单个复选框的选中状态

<table id="myTable">
    <tr>
        <td><input type="checkbox" class="rowCheckbox" data-id="1"></td>
        <td>Row 1</td>
    </tr>
    <tr>
        <td><input type="checkbox" class="rowCheckbox" data-id="2"></td>
        <td>Row 2</td>
    </tr>
</table>

document.addEventListener('DOMContentLoaded', function() {
    // 获取所有复选框
    var checkboxes = document.querySelectorAll('.rowCheckbox');

    // 遍历复选框并检查选中状态
    checkboxes.forEach(function(checkbox) {
        checkbox.addEventListener('change', function() {
            if (this.checked) {
                console.log('Checkbox with ID ' + this.getAttribute('data-id') + ' is checked.');
            } else {
                console.log('Checkbox with ID ' + this.getAttribute('data-id') + ' is unchecked.');
            }
        });
    });

    // 查找特定ID的复选框状态
    function checkStatusById(id) {
        var checkbox = document.querySelector('.rowCheckbox[data-id="' + id + '"]');
        if (checkbox) {
            console.log('Checkbox with ID ' + id + ' is ' + (checkbox.checked ? 'checked' : 'unchecked'));
        } else {
            console.log('Checkbox with ID ' + id + ' not found.');
        }
    }

    // 示例：查找ID为1的复选框状态
    checkStatusById(1);
});