HTML 中的 <select> 对象代表了一个下拉菜单,用户可以从中选择一个或多个选项。下面我们将详细介绍如何使用 <select> 对象以及相关属性和方法。
创建一个下拉菜单
要创建一个下拉菜单,只需在 HTML 中使用 <select> 标签,并在其中使用 <option> 标签定义选项。例如:
<select> <option value="1">Option 1</option> <option value="2">Option 2</option> <option value="3">Option 3</option> </select>
在上面的示例中,我们创建了一个简单的下拉菜单,其中包含三个选项。
属性
selectedIndex
selectedIndex 属性用于获取或设置当前选中选项的索引值。索引值从 0 开始,如果没有选中任何选项,则返回 -1。
-- -------------------- ---- ------- ------- -------------- ------- ---------------- ---------- ------- ---------------- ---------- ------- ---------------- ---------- --------- -------- --- ------ - ------------------------------------ ---------------------------------- -- ------------ ---------
options
options 属性返回一个包含所有选项的 HTMLCollection 对象。
-- -------------------- ---- ------- ------- -------------- ------- ---------------- ---------- ------- ---------------- ---------- ------- ---------------- ---------- --------- -------- --- ------ - ------------------------------------ ----------------------------------- -- ------- ---------
方法
add()
add() 方法用于向下拉菜单中添加新选项。该方法接受两个参数:要添加的选项和要添加的位置。
-- -------------------- ---- ------- ------- -------------- ------- ---------------- ---------- ------- ---------------- ---------- --------- -------- --- ------ - ------------------------------------ --- ------ - --------------------------------- ----------- - ------- --- ------------ - ---- ------------------ --- -- ----------- ---------
remove()
remove() 方法用于从下拉菜单中移除选项。该方法接受一个参数:要移除的选项的索引值。
-- -------------------- ---- ------- ------- -------------- ------- ---------------- ---------- ------- ---------------- ---------- ------- ---------------- ---------- --------- -------- --- ------ - ------------------------------------ ----------------- -- ------- ---------
以上就是关于 HTML 对象 <select> 的详细介绍,希望对你有所帮助。
| 集合 | 描述 | W3C |
|---|---|---|
| options | 返回包含下拉列表中的所有选项的一个数组。 | Yes |
| 属性 | 描述 | W3C |
|---|---|---|
| disabled | 设置或返回是否应禁用下拉列表。 | Yes |
| form | 返回对包含下拉列表的表单的引用。 | Yes |
| length | 返回下拉列表中的选项数目。 | Yes |
| multiple | 设置或返回是否选择多个项目。 | Yes |
| name | 设置或返回下拉列表的名称。 | Yes |
| selectedIndex | 设置或返回下拉列表中被选项目的索引号。 | Yes |
| size | 设置或返回下拉列表中的可见行数。 | Yes |
| type | 返回下拉列表的表单类型。 | Yes |
| 方法 | 描述 | W3C |
|---|---|---|
| add() | 向下拉列表添加一个选项。 | Yes |
| remove() | 从下拉列表中删除一个选项。 | Yes |