[JavaScript知识库]第二次网页前端培训笔记（表单标签）

1.表单标签

form标签，块级元素，会自动换行，将数据传输给服务器

常用属性：

action? ? ? ? 表单提交的地址URL

id? ? ? ? ? ? ? ?唯一标识?

name? ? ? ? 名称

target? ? ? ? 表单提交打开方式（当前窗口）

method? ? ?提交方式

get请求：参数会直接跟在URL地址栏后面，用问号拼接。安全性差，传递的数据量小，效率高（是post速度的两倍），有缓存。

post请求：参数不会直接跟在URL地址栏后面，会放在请求体中。安全性高，传输数据量大，速度相对来说慢，无缓存。

2.表单元素标签（input、textarea、label、button、select）

1.input（文本框、单标签）

input元素

? ? ? ?type 表单元素的类型

? ? ? ? ? ? ??text 文本框

? ? ? ? ? ? ? password密码框

? ? ? ? ? ? ? radio单选框（需要设置一组相同的name属性值）

? ? ? ? ? ? ? CheckBox复选框（需要设置一组相同的name属性值）

? ? ? ? ? ? ? button普通按钮

? ? ? ? ? ? ? hidden 隐藏域（用来存放需要传送给服务器，但不需要显示的数据）

? ? ? ? ? ? ? file文件域（上传文件）

? ? ? ? ? ? ? date日期框

? ? ? ? ? ? ? submit提交按钮

? ? ? ? ? ? ? reset重置按钮

? ? ? ? ? ? ? image图片按钮（提交按钮）

? ? ?? value表单元素的值

? ? ??checked是否选中（单选框/复选框）

? ? ? disabled是否禁用

? ? ? maxlength允许输入的最大字符

注：表单元素需要设置name属性值，否则数据无法传递！！！

2.textarea（文本域，双标签）

属性：cols 列和 rows 行

3.label标签（双标签）

设置label标签的for属性值与表单元素的ID属性值对应，当点击label标签时，会自动给表单元素聚焦。

4.button按钮（双标签）

格式：

<button type="button">普通按钮</button>

<button type="submit">提交按钮</button>

<button type="reset">重置按钮</button>

另：<button >按钮</button>? ? ?默认的是提交按钮

5.select标签（双标签）

select用于定义下拉列表

格式：

<select? name="color">

? ? ? ?<option? value="red">红色</option>

? ? ? <option? value="blue">蓝色</option>

? ? ? <option? value="green">绿色</option>

</select>

常用属性：

value? ? ? ? ?设置值，用于传到后台

selected? ? 设置选中状态

3.字符实体

<? ? ? ? ? ? ? ?&lt;

>? ? ? ? ? ? ? ?&gt;

空格? ? ? ?? ?&nbsp;

版权符? ? ? &copy;

例子：

将<h2>hello world</h2>? 改为? ?&lt;h2&gt;hello world&lt;/h2&gt;

则最终结果是文本而不是标题。