Question

defaultChecked比checked更适合哪种用例？

已选中-布尔值
  当类型为复选框或单选时，返回/设置元素的当前状态。

defaultChecked — 布尔值
返回/设置单选按钮或复选框的默认状态，此状态最初是在创建该对象的HTML中指定的。

document.getElementById('opt2').checked = true;
document.querySelectorAll('input').forEach(input => console.log(input.checked))

<input type="checkbox" checked id="opt1"> <!-- defaultChecked -->
<input type="checkbox" id="opt2"> <!-- checked by user or js -->

Answer 1

如果可以通过<input type="reset">或调用.reset()的方式重置表单，则defaultChecked将允许您动态更改重置表单的含义和行为。

defaultChecked可能是有益的另一个可能的用例是使用:default伪类将元素包括在选择中或从选择中排除。也许可以将其用于样式目的。

但是，正如前面的评论所述，这两个属性都有不同的行为，我认为重要的是考虑更改某些内容的“默认”并相应选择的语义含义。

document.getElementById('opt2').checked = true;
document.getElementById('opt3').defaultChecked = true;

document.querySelectorAll('input[type=checkbox]').forEach(input => console.log(input.checked));
document.querySelectorAll('input:default').forEach(input => console.log(input.id));

<form>
    <input type="checkbox" checked id="opt1"> <!-- defaultChecked -->
    <input type="checkbox" id="opt2"> <!-- checked by user or js -->
    <input type="checkbox" id="opt3"> <!-- defaultChecked by js -->
    <input type="reset">
</form>

有没有什么地方defaultChecked比仅引用checked更有利？

1 个答案: