如何更改 HTMLCollection 中选择框的选择索引？

Question

我正在尝试重置页面上所有选择框的值。有问题的事件发生在 onClick 中，因此所有内容都加载到 DOM.

我已经通过 var selectBoxes = document.getElementsByClassName("selectBox"); 获得了 selectBoxes 的 HTMLCollection 我现在想将每个 selectBoxes 的 selectIndex 更改为 0。

但是，每次我尝试访问 HTMLCollection 中特定对象的属性时，我都会得到一个未定义的值。

selectBoxes.item(0).selectedIndex = undefined
selectBoxes[0].selectedIndex = undefined

var selectBoxes = document.getElementsByClassName("filterBox");
  console.log(selectBoxes); //a nice JavaScriptObject
  for(i = 0; i < selectBoxes.length; i++){
      selectBoxes.item(i).selectedIndex = 0;
  }

这是一篇关于 HTMLCollections 的非常有趣的文章：https://hackernoon.com/htmlcollection-nodelist-and-array-of-objects-da42737181f9 似乎解释了我的部分问题。

Answer 1

我错误地访问了 selectedIndex 属性。它不是 selectBox 本身的直接属性，而是它似乎在 selectBox 的子项中。

  var selectBoxes = document.getElementsByClassName("filterBox");
  for(i = 0; i < selectBoxes.length; i++){
      selectBoxes.item(i).children[0].selectedIndex = 0;
  }

如何更改 HTMLCollection 中选择框的选择索引？

How to change the selectIndex of a selectBox in an HTMLCollection?

javascript

drop-down-menu

htmlcollection