素材编辑 | 宋大狮

单选是由多个单选项组成的选择控件，获取用户针对某个事情的唯一结果。

常用场景有“微信APP-我-个人信息-设置性别”、“iOS设置-通知-显示预览”等。

原型画法（无交互）

单选功能通常包含标题和多个单选项，每个单选项由选项名称和单选按钮。

（1）先画标题。从默认元件库拖动“文本标签”到工作区，或者直接把“页面名称”作为标题。

<select>下拉框

<option>是下拉框的选项

<submit>提交按钮

<value>名称提交方式

<checked>单选按钮进入页面必选这个

<checkbox>多选按钮

在实际业务开发中，我们常常需要获取用户选择的单选按钮的值，比如用户在注册时选择性别、问卷调查时选择答案等。今天，我们就来聊聊如何在JavaScript中获取单选按钮组的值。

实际业务场景

表单的本质是业务，没有表单是无法完成业务系统的，而动态表单使业务系统更高级。动态表单是什么呢？它是如何工作的？应用场景有哪些？一起来看一下吧。

一、表单

表单在网页中主要负责数据采集功能，是提交数据的一切形式。表单的本质是提交数据，不仅仅包含输入框、下拉选择框等这些控件，常见的按钮空间也属于一个表单。

HTML称为超文本标记语言，是一种标识性的语言。常用的元素有：文本格式化、列表、链接、图像、视频、音频、表格、表单。本节主要学习表格、表单这2个常用元素

表格

• 表格基本元素

<table>
<tr> <!--行 table row-->
<td> </td> <!--列 table data-->
<td> </td>
...
</tr>
...
</table>

1. 如何理解CSS盒子模型

标准盒子模型：宽度=内容的宽度（content）+ border + padding

低版本IE盒子模型：宽度=内容宽度（content+border+padding）