表单
*表单:将用户信息组装起来的容器
01.应用场合:登录、搜索、注册、调查问卷，凡是使用提交数据的地方都设计到表单
02.表单标签:<form></form>
03.action属性:提交表单的时候，向服务器发送请求数据
语法：
<form action="URL"></form>
属性：URL→指定提交的路径
描述：
当表单提交时何处发送表单数据
绝对URL：指定另一个网站
相对URL：指定网站内部的一个文件
04.method：指定如何发送表单数据
get：
001.将表单数据以名称、值对的形式附加到URL中
002.URL长度=大约3000个字符
（提交表单及表单的所有）
003.注意：使用get提交的敏感数据在URL中直接显示
004.安全隐患：URL可能被服务器的access log（日志文件）中记录
post：
001.将表单数据附加到http请求body中（内部不显示URL中的数据）
002.提交的表单没有长度显示
（仅提交表单）
003.注意：post提交的数据没有书签
1.标签<input></input>
属性:
(1)type: 属性规定 input 元素的类型。
01.button 定义可点击按钮（多数情况下，用于通过 JavaScript 启动脚本）。
02.checkbox 定义复选框。
03.file 定义输入字段和 "浏览"按钮，供文件上传。
04.hidden 定义隐藏的输入字段。
05.password 定义密码字段。该字段中的字符被掩码。
06.radio 定义单选按钮。
07.reset 定义重置按钮。重置按钮会清除表单中的所有数据。
08.submit 定义提交按钮。提交按钮会把表单数据发送到服务器。
09.text 定义单行的输入字段，用户可在其中输入文本。默认宽度为 20 个字符。
010.color 定义颜色（IE浏览器不支持）
011.date 定义日期
①datetime-local 定义日期及时间
012.number 定义数字
语法:
<input type="number" min="1" max="5" />
min→最小值(包括最小值)
max→最大值(包括最大值)
013.image 使用图片按钮
语法:
<input type="image" src="../图/IMG_20171114_003718.jpg" alt="submit" width="20" height="20" />
014.search 定义搜索框
(1)autocomplete 记录
default→
off→开
on→关
(2)多行文本框
语法:
<textarea cols="显示的列数" rows="显示的行数" >
<!--内容-->
</textarea>
(3)滑块
语法:
range 创建滑轮的值
(4)图片按钮()
语法:
<input type="图片路径" alt="submit" width="宽度" height="高度" />
015.表单初级数据验证
(1)优点:
①减轻服务器压力
②保证数据的安全性和可靠性
③不用返回同步数据(用于Ajax)
(2)input标签→属性
①placeholder:初级表单验证(提示)
②required:验证文本框不能为空
③pattern→正则表达式:用户输入的内容是否与自定义的表达式相匹配
016.placeholder
*输入字段预期值的提示信息
语法
*<form>标签内进行操作
1.文本框:
姓名:<input type="text">
密码:<input type="password">
2.按键:
<input type="submit" value="提交">
<input type="reset" value="重填">
form标签里的method的赋值:
post的话URL信息不会发生变1化
get的话URL信息会发生变化
3.单选按钮:
<input name="指定的名称" type="radio" value="男">男
<input name="gen" type="radio" value="女">女
4.复选框:
语法:
爱好:
<input type="checkbox" value="sports">运动
<input type="checkbox" value="sports">聊天
<input type="checkbox" value="sports">游戏
5.列表框(下拉文本框):
语法:
季节:
<select name="列表名称" size="行数">
<option value="请选择" selected= "默认选中的行数">请选择</option>
<option value="春">春</option>
<option value="夏">夏</option>
<option value="秋">秋</option>
<option value="冬">冬</option>
</select>
*value:可选项的值
6.多行文本框:
<textarea cols="显示的列的宽度" rows="显示的行数">
文本内容
</textarea>
7.文件域:
<input type="file" name="file">
<br/>
<input type="submit" value="上传">
8.设置表单的隐藏域
type属性设置为hidden
在登录页面userid
9.表单只读与禁用设置
只读是readonly
禁用是disabled
程序中-->readonly="readonly" disabled="disabled" selected="selected" checked="checked"
*应用场合:
只读:网站服务器不希望个体用户改掉数据中的值
禁用:只要满足条件,就可以使用该功能
10.语化得表单;
(1)域
<fieldset>
<legend>用户信息</legend>
姓名:<input type="text">
年龄:<input type="text">
手机号:<input type="text">
</fieldset>
11.表单元素的标注
性别:
<label for="male">男</label>
<input type="radio" id="male">
<label for="female">女</label>
<input type="radio" id="female">
