选择长度与 options.length答案

【问题标题】：Select length vs. options.length选择长度与 options.length
【发布时间】：2013-10-18 13:32:19
【问题描述】：

对于选择元素，length 属性和options.length 属性有什么区别吗？

特别是，我很想知道在浏览器支持方面是否存在差异。

【问题讨论】：

你能澄清“差异”吗？输出不同，执行速度不同..？
@RUJordan 有什么不同。到目前为止我还没有找到，我想知道为什么我们需要两个行为相同的属性。
你应该使用.options.length，它的意图清晰，更干净。 The .length property on the <select> itself does only exist because it can act as the options container itself (quirks introduced by IE and standardized with HTML5).
@Bergi 不是根据developer.mozilla.org/en-US/docs/Web/API/…，它声明 select.length 正式表示“此选择元素中
@Christophe：我不知道（也不会在意）。每个当前的、体面的浏览器都支持这两者；可能是早期的 IE/NN 不支持.options.length，早期的其他浏览器不兼容 IE。

【解决方案1】：

这肯定不一样，我必须找出困难尝试

在 HTML/PHP 中定义了 3 个选项

调用一个JQUERY函数，结果是

在组合框中选择任何内容之前

console.log(select.length);   // 1
console.log(select.options.length); // undefined

选择后

console.log(select.length);   // 3
console.log(select.options.length); // 3

【讨论】：

【解决方案2】：

基于https://developer.mozilla.org/en-US/docs/Web/API/HTMLSelectElement，没有功能上的区别，只有“如果你想真正了解它的技术性”区别：

select.length 正式声明为 select 元素包含的选项元素的数量。按照规范定义，它将始终具有与select.options.length 相同的值，即：
select.options.length 是“选择元素上的选项子节点列表中的元素数”。技术差异，语义上略有不同，但由于 select.length 的形式化方式，对于所有意图和目的而言，始终具有相同的值。

所以从技术上讲，第一个“存在”在<select> 元素上，第二个存在于<select> 元素的options 属性上（这是一个HTMLOptionsCollection，而不是一个数组！），但值始终相同你使用哪个并不重要。实现规范的浏览器（参见 [1] 和 [2]）总是会给出正确的值。

【讨论】：

【解决方案3】：

两个

选择.长度

和

select.options.length

所有主流浏览器都支持。

它们之间的唯一区别（据我所知）是

select.length 是 select 属性，它返回其选项数量 - 这就是定义。换句话说，length in select 是这个特定 DOM 元素的特殊属性
select.options.length 只返回options 集合中的元素个数（与document.getElementsByTagName('div').length 的逻辑相同）

【讨论】：