Question

我是Typescript的新手，我有一个下拉列表，我需要迭代它的值。这是我正在尝试的代码：

var sortBy = document.getElementById("SortbySel");

我想迭代选项但由于这是一个HTMLElement，我无法这样做。最好的方法是什么？

Answer 1

一种方法是使用querySelectorAll函数：

var options = document.querySelectorAll('#SortbySel option');
for(var i = 0; i < options.length; i++){
    console.log(options.item(i).value);
}

Answer 2

查看this stackblitz POC，我迭代select HTML element

如果您使用typescript，最好使用HTMLSelectElement＆amp;等特定类。 HTMLOptionElement而不是使用传统的var声明，因为它在intellisense中有很大帮助。

代码看起来像这样 -

let selectElement: HTMLSelectElement = 
document.getElementById('select') as HTMLSelectElement;

for (let i = 0; i < selectElement.options.length; i++) {
  let option: HTMLOptionElement = selectElement.options[i];
  console.log(option);
}

打字稿：通过下拉列表迭代

2 个答案: