task5

1. form表单有什么作用？有哪些常用的input 标签，分别有什么作用？

• 表单的作用是搜集用户的输入，向服务器传输数据，从而实现用户与web服务器的交互。
• Input表示Form表单中的一种输入对象，根据Type类型可分为文本输入框、密码输入框、单选/复选框、提交/重置按钮等等。
  在HTML5中，规定的 input type 属性值如下：
• 一些type值及其作用（最后有详细版）
• button: 定义可点击按钮
• checkbox: 复选框
• email : 定义用于e-mail地址字段，提交时会验证
• file : 上传文件
• hidden : 定义隐藏字段
• image : 定义图像为提交按钮
• color : 定义拾色器，定义后出现颜色调板
• date: 定义 date 控件（包括年、月、日，不包括时间）

2. post 和 get 方式的区别？

• GET比POST更不安全，因为参数直接暴露在URL上，所以不能用来传递敏感信息。 GET参数通过URL传递，POST放在Request body中。
• GET请求在URL中传送的参数是有长度限制的，而POST理论上是不受限制的。
• GET在浏览器回退时是无害的，而POST会再次提交请求。
• GET和POST本质上就是TCP链接，并无差别。但是由于HTTP的规定和浏览器/服务器的限制，导致他们在应用过程中体现出一些不同。对于GET方式的请求，浏览器会把http header和data一并发送出去（一个包），服务器响应200(返回数据);而对于POST，浏览器先发送header，服务器响应100 continue，浏览器再发送data（两个包），服务器响应200 ok(返回数据)。”

3. 在input里，name 有什么作用？

name 属性规定 input 元素的名称。
name 属性用于对提交到服务器后的表单数据进行标识，或者在客户端通过 JavaScript 引用表单数据。
注释：只有设置了 name 属性的表单元素才能在提交表单时传递它们的值。

4. radio 如何 分组?

设置相同的name属性值.

5. placeholder 属性有什么作用?

<input type="text" name="first_name" placeholder="你的姓名..." />
placeholder 属性提供可描述输入字段预期值的提示信息（hint）。
该提示会在输入字段为空时显示，并会在字段获得焦点时消失。
注释：placeholder 属性适用于以下的 <input> 类型：text, search, url, telephone, email 以及 password。

6. type=hidden隐藏域有什么作用? 举例说明

• 隐藏域在页面中对于用户是不可见的，在表单中插入隐藏域的目的在于收集或发送信息，以利于被处理表单的程序所使用。浏览者单击发送按钮发送表单的时候，隐藏域的信息也被一起发送到服务器。

• 有些时候我们要给用户一信息，让他在提交表单时提交上来以确定用户身份，如sessionkey，等等．当然这些东西也能用cookie实现，但使用隐藏域就简单的多了．而且不会有浏览器不支持，用户禁用cookie的烦恼。
• 有些时候一个form里有多个提交按钮，怎样使程序能够分清楚到底用户是按那一个按钮提交上来的呢？我们就可以写一个隐藏域，然后在每一个按钮处加上onclick="document.form.command.value="xx""然后我们接到数据后先检查command的值就会知道用户是按的那个按钮提交上来的。
• 有时候一个网页中有多个form，我们知道多个form是不能同时提交的，但有时这些form确实相互作用，我们就可以在form中添加隐藏域来使它们联系起来。
• javascript不支持全局变量，但有时我们必须用全局变量，我们就可以把值先存在隐藏域里，它的值就不会丢失了。
• 还有个例子，比如按一个按钮弹出四个小窗口，当点击其中的一个小窗口时其他三个自动关闭．可是IE不支持小窗口相互调用，所以只有在父窗口写个隐藏域，当小窗口看到那个隐藏域的值是close时就自己关掉。

简单介绍 HTML 表单的用法

HTML表单是一个包含表单元素的区域， 表单使用<form> 标签创建。注意，<form >元素是块级元素。

1.表单属性

• action：规定当提交表单时，向何处发送表单数据。action取值为:第一，一个URL（绝对URL/相对URL），一般指向服务器端一个程序,程序接收到表单提交过来的数据（即表单元素值）作相应处理。第二，使用mailto协议的URL地址，这样会将表单内容以电子邮件的形式发送出去。这种情况比较少见的，因为它要求访问者的计算机上安装和正确设置好了邮件发送程序。第三，空值，如果action为空或不写，表示提交给当前页面。
• method：该属性定义浏览器将表单中的数据提交给服务器处理程序的方式。关于method的取值，最常用的是get和post。
• target：该属性规定在何处显示action属性中指定的URL所返回的结果。取值有_blank（在新窗口中打开）、_self（在相同的框架中打开，默认值）、_parent（在父框架中打开）、_top（在整个窗口中打开）和framename（在指定的框架中打开）。
• title：设置网站访问者的鼠标放在表单上的任意位置停留时，浏览器用小浮标显示的文本。
• enctype：规定在发送到服务器之前应该如何对表单数据进行编码。取值：默认值为 "application/x-www-form-urlencoded"，在发送到服务器之前，所有字符都会进行编码；“multipart/form-data”：不对字符编码。在使用包含文件上传控件的表单时，必须使用该值。
• name:表单的名称。注意和id属性的区别：name属性是和服务器通信时使用的名称；而id属性是浏览器端使用的名称，该属性主要是为了方便客户端编程，而在css和JavaScript中使用的。

2. 表单元素

• 单行文本框<input type="text"/>（input 的type 属性的默认值就是"text"）
• 密码框<input type="password"/>
• 单选按钮<input type="radio"/>。表单提交时，选中项的value和name被打包发送
• 复选框<input type="checkbox"/>。表单提交时，选中项的value和name被打包发送
• 隐藏域<input type="hidden"/>。隐藏域通常用于向服务器提交不需要显示给用户的信息
• 文件上传<input type="file"/>。使用file，则form的enctype必须设置为multipart/form-data，method属性为POST
• 下拉框<select>标签
• 多行文本<textarea></textarea>。<textarea>没有value属性
• <label></label>标签。在<input type=“text”>前可以写普通的文本来修饰，但是单击修饰文本的时候input并不会得到焦点，而用label则可以，for属性指定要修饰的控件的id
• 提交按钮<input type="submit"/>。当用户单击<inputt type="submit"/>的提交按钮时，表单数据会提交给<form>标签的action属性所指定的服务器处理程序。中文IE下默认按钮文本为“提交查询”，可以设置value属性修改按钮的显示文本。
• 重置按钮<input type="reset"/>。当用户单击<input type="reset"/>按钮时，表单中的值被重置为初始值。在用户提交表单时，重置按钮的name和value不会提交给服务器。
• 图像按钮<input type="image" src="bg.jpg"/>。图像按钮的src属性指定图像源文件，它没有value属性。
  参考自