HTML 中 <select> 与 <option> 元素详解

什么是 <select> 和 <option>？

在 HTML 表单中，<select> 元素用于创建下拉列表， 而 <option> 元素则定义下拉列表中的每一个可选项。 这是用户从多个预设值中进行选择的标准方式。

需要注意的是：HTML 中没有名为 <choice> 的标准标签。 “choice”常被误用或出现在某些 XML 或自定义 DSL 中，但在原生 HTML 表单中并不存在。

基本用法示例

以下是一个简单的下拉选择框：

<label for="fruit">请选择水果：</label>

<select id="fruit" name="fruit">

  <option value="apple">苹果</option>

  <option value="banana">香蕉</option>

  <option value="orange">橙子</option>

</select>

在浏览器中效果如下：

常见属性说明

• value：提交给服务器的实际值。
• selected：设置默认选中项。
• disabled：禁用某个选项或整个下拉框。
• multiple：允许用户选择多个选项（需配合 Ctrl 或 Shift）。

为什么没有 <choice> 标签？

HTML 规范由 W3C 和 WHATWG 维护，目前所有版本（包括 HTML5）均未定义 <choice> 元素。 如果你在某些框架、模板语言或旧文档中看到 “choice”，它可能是：

• 自定义组件（如 Vue、React 中的封装）
• XML Schema 或 XForms 中的概念
• 对 <option> 的误称

在标准 Web 开发中，请始终使用 <select> + <option>。