如何获取checkbox值？JS判断复选框未选中点击失效怎么办

问题原因 #

你的代码无法生效主要是两个写法错误：

• 访问带连字符的DOM属性时直接写z[0].aria-checked是非法语法，JS会把连字符识别为减法运算符，直接抛出运算错误，后续逻辑完全不会执行。
• aria-checked是无障碍场景用的辅助属性，和复选框原生选中状态不一定同步，用它做状态判断本身就不可靠。

正确实现代码 #

对应HTML（原有结构无需修改） #

<input type="checkbox" aria-checked="false" class="cloud-private" value="" data-spm-anchor-id="a800.io">

修复后的JS逻辑 #

// 获取目标复选框，加下标[0]取第一个匹配元素
const checkboxList = document.getElementsByClassName('cloud-private');
const targetCheckbox = checkboxList[0];

// 先判断元素是否存在，避免页面没加载对应元素时抛出错误
if (targetCheckbox) {
  // 用原生checked属性判断选中状态：值为false就是未选中
  if (!targetCheckbox.checked) {
    targetCheckbox.click();
  }
}

// 获取复选框选中状态直接读.checked即可，返回布尔值true（选中）/false（未选中）
// 获取复选框绑定的value值，直接读targetCheckbox.value即可

补充说明 #

如果确实有特殊场景需要读取aria-checked属性，不能用点语法直接访问，要调用getAttribute方法：

const ariaCheckedStatus = targetCheckbox.getAttribute('aria-checked');
if (ariaCheckedStatus === 'false') {
  // 对应业务逻辑
}

这种写法不推荐日常使用，点击复选框后如果业务代码没有同步更新aria-checked的值，会出现判断结果和实际选中状态不一致的问题。

内容的提问来源于stack exchange，提问作者Le Nguyen