Как я могу отключить все флажки на веб-странице сразу?

Question

У меня есть несколько наборов флажков на веб-странице.Я хочу снять их все с помощью JavaScript.Прямо сейчас я делаю это, ища имена каждого набора и снимая их с циклов FOR, как это ...

    for (i=0;i<document.getElementsByName("myboxes").length;i++) {
document.getElementsByName("myboxes")[i].checked=false;}

for (i=0;i<document.getElementsByName("moreboxes").length;i++) {
document.getElementsByName("moreboxes")[i].checked=false;}

for (i=0;i<document.getElementsByName("evenmoreboxes").length;i++) {
document.getElementsByName("evenmoreboxes")[i].checked=false;}

Я ищу способ нацелить их всех одним циклом.Я мог бы сделать getElementsByTagName('input'), чтобы нацелиться на все ВХОДЫ, но это проблема, потому что у меня есть некоторые радиовходы, которые я не хочу отключать.Есть ли способ нацелиться на все checkbox inputs?

---

Спасибо за предложения.Я просто подумал о чем-то.Каждое ИМЯ, которое я использую, содержит слово «ящики», myboxes, moreboxes, moremoreboxes.Есть ли способ указать слово «коробки» в имени, например, подстановочный знак, что-то вроде document.getElementsByName("*boxes") таким образом, если я добавлю набор флажков в какой-то момент, который я не хочу снимать, я могу просто назвать ихпо-разному.

Answer 1

Вы можете установить все отмеченные флажки и сбросить их состояние:

function uncheckAll() {
  document.querySelectorAll('input[name$="boxes"]:checked')
    .forEach(checkbox => checkbox.checked = false);
}

<input type="checkbox"/>
<input type="checkbox" name="a_boxes" checked/>
<input type="checkbox"/>
<input type="checkbox" name="b_boxes" checked/>
<input type="checkbox" name="c_boxes" checked/>


<button onclick="uncheckAll()">Reset</button>

Answer 2

Мое предложение:

document.querySelectorAll("[name=myboxes], [name=moreboxes], [name=evenmoreboxes]").forEach((e) => echecked=false);

document.querySelectorAll("[name=myboxes], [name=moreboxes], [name=evenmoreboxes]").forEach((e) => e.checked=false);

<input type="checkbox" name="myboxes" value="1" checked>1<br>
<input type="checkbox" name="moreboxes" value="2" checked>2<br>
<input type="checkbox" name="evenmoreboxes" value="3" checked>3<br>

Answer 3

Как подсказывает @imjared, вы можете использовать querySelectorAll, но вам придется перебирать его:

querySelectorAll('input[type="checkbox"]').forEach(c => c.checked = false);

Вот документ для querySelectorAll

Answer 4

вы можете использовать document.querySelectorAll('input[type="checkbox"]');, чтобы получить список их всех. затем запустите свой цикл