HTML 中的 <form>
元素用于创建一个包含各种表单元素的表单,用户可以在这个表单中输入数据并提交给服务器进行处理。在前端开发中,我们经常需要使用 <form>
元素来收集用户输入的数据,并进行相应的处理。
属性
action
:指定表单数据提交的目标 URL。
method
:指定表单数据提交的方式,可以是 GET 或 POST。
enctype
:指定表单数据的编码类型,常见的有 application/x-www-form-urlencoded
和 multipart/form-data
。
表单元素
在 <form>
元素内部,可以包含各种表单元素,如文本框、下拉框、复选框、单选框等,用于收集用户输入的数据。以下是一些常见的表单元素:
<input type="text">
:用于输入文本。
<input type="password">
:用于输入密码。
<input type="checkbox">
:用于选择多个选项。
<input type="radio">
:用于选择单个选项。
<select>
:下拉框,用户可以从预定义的选项中选择一个。
<textarea>
:多行文本框。
示例代码
-- -------------------- ---- -------
----- ---------------- --------------
------ ---------------------------
------ ----------- ------------- ------------------------
------ --------------------------
------ --------------- ------------- ------------------------
------------------
------ ------------ ------------- --------------
------ ------------ ------------- ------------------------
------ ----------------------
------- --------- ------------
------- ---------------------------
------- ----------------------------
------- -----------------------------
-----------------
------ -----------------------------
--------- ------------ -------------- -------- -----------------------------
------ ------------- -----------
-------
以上是一个简单的表单示例,包含了文本框、密码框、单选框、下拉框和多行文本框等表单元素,用户可以填写相应的信息并点击提交按钮进行数据提交。在实际开发中,我们可以通过 JavaScript 来对表单进行验证和处理,以提升用户体验和数据的准确性。