日期:2014-05-17  浏览次数:20853 次

html学习笔记_表单的用法
一、Form中的get和post方法,在数据传输过程中分别对应了HTTP协议中的GET和POST方法。二者主要区别如下:
1、Get是用来从服务器上获得数据,而Post是用来向服务器上传递数据。
2、 Get将表单中数据的按照variable=value的形式,添加到action所指向的URL后面,并且两者使用“?”连接,而各个变量之间使用 “&”连接;Post是将表单中的数据放在form的数据体中,按照变量和值相对应的方式,传递到action所指向URL。
3、 Get是不安全的,因为在传输过程,数据被放在请求的URL中,而如今现有的很多服务器、代理服务器或者用户代理都会将请求URL记录到日志文件中,然后放在某个地方,这样就可能会有一些隐私的信息被第三方看到。另外,用户也可以在浏览器上直接看到提交的数据,一些系统内部消息将会一同显示在用户面前。 Post的所有操作对用户来说都是不可见的。
4、Get传输的数据量小,这主要是因为受URL长度限制;而Post可以传输大量的数据,所以在上传文件只能使用Post(当然还有一个原因,将在后面的提到)。
5、Get限制Form表单的数据集的值必须为ASCII字符;而Post支持整个ISO10646字符集。
6、Get是Form的默认方法。
action的引号内填的是路径方法,比如发送到邮箱或其他网页什么的



二、

在HTML里面class="css_type"表示样式选择,是引用CSS样式中css_type的类型,调用一个样式表里面的类。


css_type就是一个样式的选择符 意思是引用a2这个样式
在这之前你必须定义css_type的样式
比如:
css_type
{
color:red;
font-size:12px;




2.2、class是页面调用CSS样式表的变量


toclevel-1是样式表中定义的一个名称
举个例子 :
<style type="text/css">
.toclevel-1{
color:#000;
}
</style>

页面调用
<xx  class="toclevel-1">


三、表单域的属性分解
<form action="" method="" target="" name="">

1、action 动作(提交后执行的操作)
2、method 方法(post 数据打包发送,允许发送大量数据,安全性高;get 浏览器直接发送数据,数据量不超过1KB,安全性低,搜索默认使用)
3、target 目标(见链接)

四、各类表单元素

1、input类
type=text|password|hidden|radio|checkbox|file|image|submit|reset|button

A、text 单行文本框
<input type="text" name="" value="" size="" maxlength="">
name 名称(判断的唯一依据)
value 默认值 (onclick="this.value=''")
size 宽度(不影响输入字符数)
maxlength 最大字符数(默认255个)

B、password 密码框
<input type="password" name="" value="" size="" maxlength="">

C、hidden 隐藏域(默认值决定其功能)
<input type="hidden" name="" value="">

D、radio 单选按钮
<input type="radio" name="" value="" checked>
name 必须一致

E、checkbox 复选框
<input type="checkbox" name="" value="" checked>

F、file 文件域
<input type="file" name="" size="" value="" accept="">

G、image 图像域(默认可替代提交按钮)
<input type="image" src="图像的url">

H、submit/reset/button 提交/重置/普通


2、select 列表/菜单
<select name="" size="6" multiple>

1、size 高度
2、multiple 设置多选

option 选项
<option value="" selected>标签</option>

3、textarea 文本区域(多行文本框)
<textarea cols="列数" rows="行数" name="">默认值</textarea>

用链接替代提交/取消按钮
onclick="document.表单名称.submit()"
onclick="document.表单名称.reset()"