javascript - 选择选项的当前值存储在哪里？

Question

A <select>元素看起来像这样:

<select id="ok">
    <option value="one">First</option>
    <option value="two" selected>Second</option>
</select>

最初，Second显示文本值，因为 selected属性存在。

如果我手动更改它(使用鼠标单击)，它会在 UI 中显示新选择的值，但是 <select>在 HTML 中保持不变:

<select id="ok">
    <option value="one">First</option>
    <option value="two" selected>Second</option>
</select>

我可以获得当前选择值:

document.getElementById('ok').value

或当前选择的索引:

document.getElementById('ok').selectedIndex

通过 JavaScript(或 jQuery)，但我不知道这些值从何而来。

它们是存储在 DOM 中还是其他地方？
JavaScript 如何知道 UI 中的当前值是什么？

Answer 1

Is it stored in DOM?

是的，它存储在 DOM 中。

每当检测到更改事件时，DOM 都会更新，更新后的值将存储在 value 对象中。

当您使用 document.getElementById("ok").value 时，您可以访问 JavaScript 中的最新选择。

您可以 checkin :

Firefox 检查器 View

1. 显示 DOM 属性

   

2. 按值过滤:

   

Chrome 开发者工具

1. 选择元素>属性

   

2. 展开选择并使用垂直滚动转到值: