HTML-08.表单标签

一.表单标签

场景:在网页中主要负责数据采集功能,如注册、登录等数据采集

标签:<form>

表单项:不同类型的input元素、下拉列表、文本域等

<input>:定义表单项。通过type属性控制输入形式

<select>:定义下拉列表

<textarea>:定义文本域

属性:

action:规定当提交表单时向何处发送表单数据,URL

method:规定用于发送表单数据的方式。GET/POST

GET:表单拼接在URL后面,?username=年后&age=12,大小有限制。GET是默认提交方式

POST:表单数据在请求体中携带,大小没有限制。在消息体或者请求体中传递的

注意:表单项必须有name属性才能够提交

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>表格标签</title>
    <style>
    </style>
</head>
<body>
    <!-- 表单标签
        场景:在网页中主要负责数据采集功能,如注册、登录等数据采集
        标签:<form>
        表单项:不同类型的input元素、下拉列表、文本域等
            <input>:定义表单项。通过type属性控制输入形式
            <select>:定义下拉列表
            <textarea>:定义文本域
        属性:
            action:规定当提交表单时向何处发送表单数据,URL  
            method:规定用于发送表单数据的方式。GET/POST
                GET:表单拼接在URL后面,?username=年后&age=12,大小有限制。GET是默认提交方式
                POST:表单数据在请求体中携带,大小没有限制。在消息体或者请求体中传递的
        注意:表单项必须有name属性才能够提交
    -->
    <form action="" method="post">
        用户名 <input type="text" name="username">
        年龄 <input type="text" name="age">
        <input type="submit" value="提交" >
    </form>
</body>
</html>
相关推荐
Dream-Y.ocean2 小时前
鸿蒙PC平台宅匠 3D 室内设计适配实战:基于 Electron 壳方案的 Three.js 双渲染引擎与参数化户型编辑器开发
javascript·3d·harmonyos
Csvn3 小时前
性能监控
前端
Highcharts.js3 小时前
Highcharts Gantt使用符号的自定义数据标签开发甘特图示例
javascript·甘特图·highcharts·图表开发·实战代码·响应式图表
Csvn3 小时前
构建工具
前端
FRing034 小时前
vue2干货总结3(computed计算属性、watch监听器)
开发语言·前端·vue.js·vue2
kyriewen6 小时前
Skills 榜前 10 我全装了:只有 3 个能直接用
前端·javascript·程序员
IT_陈寒6 小时前
当Java的hashCode遇上Lombok,我的缓存被全清了
前端·人工智能·后端
工控丫丫7 小时前
帆软看板中经常使用的公式函数及经常搭的组合
前端·javascript·数据库
jerrywus7 小时前
我用 GPT-6.1-sol 做了台会讲解的 3D 售货机:60 罐饮料,一口没喝上
前端·agent·claude
孟陬8 小时前
Foobar 技术周刊#159:当看不懂代码时,如何高效排障调试。脏页陷阱:一条只读查询,写入数 TB 数据。推测解码:大模型加速利器
前端·人工智能·后端