Select的Javascript项目方法

Question

HTML:

<select id="mySelect">
    <option>Apple</option>
    <option>Orange</option>
    <option>Pineapple</option>
    <option>Banana</option>
</select>

Javascript:

var x=document.getElementById("mySelect");
alert(x.options.item(1).text);
alert(x.options[1].text);

我们在这里获取选项的文本。

和有什么区别

x.options.item(1).text

和

x.options[1].text

因为两者都产生相同的结果。

Answer 1

SELECT 元素有一个选项集合。

当您执行 options[i] 时，您实际上是在直接访问集合(例如数组)。

当您执行 options.item(i) 时，您正在访问相同的内容，但通过 API。

推荐第二种方式，因为如果集合的底层实现发生变化，您可能会得到异常。这就是有 API 的原因。

API 规范: https://developer.mozilla.org/en-US/docs/Web/API/HTMLOptionsCollection