在前端开发中，我们经常需要动态地创建下拉列表或单选框等控件，并根据一些条件对其中的选项进行预选或者默认选中。本文将介绍如何从动态创建的选项中设置选项“选定”属性。
添加“选定”属性
首先，我们需要了解每个选项的HTML结构，以便于添加“选定”属性。例如，一个单选框的HTML结构应该类似于：
------ ------------ ------------- ------------- ----
我们可以通过JavaScript代码获取到这个input元素，然后设置它的checked属性为true即可选中该选项。
--- ----- - ---------------------------------------------- ------------- - -----
同样地，对于下拉列表，我们可以通过以下方式获取其中的一个选项并设置其选中状态：
------- ---------- ------- --------------------------- ------- ---------------------------- ------- ----------------------------- ---------
--- ---------- - -------------------------------- --- --------------- - ------------------------------------------------------ ------------------------ - -----
动态创建选项
有时候，我们需要在页面加载完成之后再动态地创建选项，并设置其中的某一个选项为默认选中。我们可以使用createElement()和appendChild()方法来实现。
例如，我们需要根据一个数组动态创建下拉列表，并默认选中其中的一个值：
------- ---------------------
--- ------ - --------- --------- ----------
--- ----------- - ----------------------------------
--- ---- - - -- - - -------------- ---- -
--- ------ - ---------------------------------
------------ - ----------
----------- - ----------
-- ---------- --- --------- -
--------------- - -----
-
--------------------------------
-上述代码会动态地创建一个下拉列表，并将其中的“banana”选项设置为默认选中。
总结
本文介绍了如何从动态创建的选项中设置选项“选定”属性。无论是单选框还是下拉列表，我们都可以通过JavaScript代码控制选项的选中状态，实现更灵活的用户交互。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/14263