仅使用javascript检查第一个单选按钮作为默认值

Question

<input id="a" type="radio" name="radioButton">
<input id="b" type="radio" name="radioButton">
<input id="c" type="radio" name="radioButton">
<input id="d" type="radio" name="radioButton">

假设我有四个单选按钮，如何使用javascript将first-child设为checked作为默认值，请不要使用jQuery。

这是我所做的但没有奏效。提前谢谢。

document.querySelectorAll('[name=radioButon]:first-child').checked = true; 

Answer 1

您的示例无效的原因是因为.querySelectorAll()返回NodeList of elements。您需要迭代列表中的每个元素，以便将checked属性设置为true：

Example Here

var elements = document.querySelectorAll('[name=radioButton]:first-child');
Array.prototype.forEach.call(elements, function(el) { el.checked = true; });

---

或者，您也可以访问第一个匹配元素：

Example Here

document.querySelectorAll('[name=radioButton]')[0].checked = true;
// or..
document.querySelector('[name=radioButton]').checked = true;

---

_{作为旁注，你也有一个错字。}

^{属性选择器[name=radioButon]应为[name=radioButton]。}