HTML: 表单相关知识

1.form表单有什么作用?有哪些常用的input 标签,分别有什么作用?
答:
(1)


标签是表单的外壳,主要有4个属性,即

  • action :表单提交的地址
  • target :在何处打开 action
  • method :提交表达的方式
  • enctype:主要有以下几个参数
参数 作用
application/x-www-form-urlencoded 在发送前编码所有字符(默认)
text/plain 空格转换为“+”号,但不对特殊字符编码
multipart/form-data 不对字符编码,但使用包含文件上传控件的表单时必须包含该参数

multipart/form-data参考1
multipart/form-data参考2

(2)常用的标签,作用:

type属性 作用
text 输入内容为文本
password 输入内容为密码,输入字符被隐藏
button 按钮,可以点击。当表单内只有一个button的时候,它就变成为submit
checkbox 复选框,形状为方形选框
radio 单选框,形状为空心圆。
submit 提交按钮,将表单数据传给后台或服务器
file 上传图片,限制文件类型为以上几种
reset 重置数据

注意:单选框radio只有当name属性相同时才是单选框,如下代码:

  

HTML: 表单相关知识_第1张图片
代码展示效果

小技巧:使用label使得用户点击文字也可选中对应的单选框,方式如上图2种。

2.post 和 get 方式的区别?
答:

参考 get post
方向 向服务器请求数据 向服务器发送数据
安全性 无加密,只是简单的字符串拼接,输入框可见 有加密,输入框不可见
效率 效率高 效率相对get低
限制长度 传送数据过长时,会受到限制,一般小于2k 几乎不受限制
服务端 服务器端用Request.QueryString获取变量的值 对于post方式,服务器端用Request.Form获取提交的数据
使用建议 做数据查询和不含机密信息的传输时 含机密信息,使用添加、修改、删除时

3.在input里,name 有什么作用?
答:
(1)当在传送数据的时候,对应的会有一个key:value的值,如下图代码,当输入Name为 123 ,Email为12 时,传输给服务端的时候的形式为如下图。使得后台和服务端更清晰的识别用户提交了或是传送了什么内容。

    
        Name: 
Email:

效果图:


HTML: 表单相关知识_第2张图片
name的作用

4.radio 如何 分组?
答:将name的名字设置为相同则为同一组;设置为不同则为不同的其他组。

  
  玩1
  玩2
  玩3
  
篮球 足球 悠悠球

如图所示:


HTML: 表单相关知识_第3张图片
name分组

5.placeholder 属性有什么作用?
答:可描述输入字段预期值的简短的提示信息,仅存在页面中,不会再传输中被带到后台或服务器中。
如图:


HTML: 表单相关知识_第4张图片
image.png

6.type=hidden隐藏域有什么作用? 举例说明
答:
(1)隐藏域,暂存信息。如果一个非常重要的信息需要被提交到下一页,但又不能或者无法明示的时候,即,你在页面中无法看到它,但是你在上传数据到服务器依然存在。
(2)安全:避免CSRF攻击,用于服务器验证所提交数据的合法性,不合法则拒绝接收

hello 
  
hello

如图:


HTML: 表单相关知识_第5张图片
image.png

7.简单介绍 HTML 表单的用法
答:结合本篇文章,请看这个例子

你可能感兴趣的:(HTML: 表单相关知识)