打字稿:循环访问下拉列表

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

看看这个堆栈闪电战 POC，我在其中迭代了select HTML element

如果您使用的是typescript那么最好使用特定的类(如HTMLSelectElement&HTMLOptionElement(，而不是使用传统的var声明，因为它在智能感知中有很大帮助。

代码看起来像这样 -

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);
}