将元素ID从HTML传递到TypeScript

Question

我有下面的表单，每个选项都有一个ID。我想将每个ID读入TypeScript。我该如何处理这种情况呢？

HTML文件

  <div class="form-group" style="width: 350px">
      <label for="form_periodicity"><b>Periodicity</b></label><br>
      <select class="form-control" id="periodicity" 
       style="width: 222px">
        <option id="opt_eod">EOD</option>
        <option id="opt_daily">Daily</option>
        <option id="opt_weekly">Weekly</option>
        <option id="opt_monthly">Monthly</option>
        <option id="opt_strict_run">Strict run</option>
      </select>
  </div>

我想将id存储在TypeScript中的字符串变量中。

Answer 1

您可以使用getElementByTagName找到select元素的所有选项。您可以遍历它们并获取它们的所有ids：

const selectElement = <HTMLSelectElement>document.getElementById('periodicity');
const optionElements = selectElement.getElementsByTagName('option');
const ids = [];

for (let i = 0; i < optionElements.length; i++) {
    const optionElement = optionElements[i];
    ids.push(optionElement.id);
}

alert(ids.join(','));