如何使用JavaScript为select标签设置value值

<select>下拉框的value赋值逻辑是：仅在当前已挂载的所有<option>子项中匹配和赋值内容完全一致的value，匹配不到时下拉框会自动切换到无选中的空白状态，不会自动新增选项。
你提供的代码里，下拉框仅有4个内置选项，对应的value分别是volvo、saab、mercedes、audi，不存在value为Hello的选项，因此赋值后出现空白是符合DOM规范的正常表现，并非代码运行报错。

根据实际需求二选一即可：

• 若目标是选中下拉框已有选项，直接将赋值内容替换为目标选项对应的value即可，例如要选中Saab选项，代码改为document.getElementById('cars').value = 'saab';即可正常生效。
• 若确实要让下拉框选中显示"Hello"内容，需要先向下拉框中插入对应value的<option>节点，再执行赋值选中操作，参考实现代码：

function disableTip() {
  const selectEl = document.getElementById('cars');
  // 创建文本和value均为Hello的选项
  const helloOpt = new Option('Hello', 'Hello');
  // 将新选项插入下拉框
  selectEl.appendChild(helloOpt);
  // 此时赋值即可正常选中
  selectEl.value = 'Hello';
}

内容的提问来源于stack exchange，提问作者user18974397