Form 表单简单介绍

form表单有什么作用?

根据需制作包含表单元素的表单,用户填写后,表单会收集数据并传输到服务器存储,用于开发者查看调用。

有哪些常用的input 标签,分别有什么作用?

input标签 作用
<input type="text"> 用于输入单行文字字段
<input type="password"> 用于输入密码字段
<input type="checkbox"> 用于点选多项选择
<input type="radio"> 用于点选单项选择
<input type="file"> 用于上传附件
<input type="text"> 用于单行文字字段
<input type="hidden"> 定义隐藏的输入字段
<input type="reset"> 定义重置按钮
<input type="submit"> 定义提交按钮
<input type="number"> 定义包含数字值的输入字段
<input type="button"> 定义按钮

post 和 get 方式的区别?

  • GET在浏览器回退时是无害的,而POST会再次提交请求

  • GET产生的URL地址可以被Bookmark,而POST不可以

  • GET请求会被浏览器主动cache,而POST不会,除非手动设置

  • GET请求只能进行url编码,而POST支持多种编码方式

  • GET请求参数会被完整保留在浏览器历史记录里,而POST中的参数不会被保留

  • GET请求在URL中传送的参数是有长度限制的(浏览器通常都会限制url长度在2K个字节,而大多数服务器最多处理64K大小的url),而POST没有限制。

  • 对参数的数据类型,GET只接受ASCII字符,而POST没有限制

  • GET比POST更不安全,因为参数直接暴露在URL上,所以不能用来传递敏感信息

  • GET参数通过URL传递,POST放在Request body中

  • GET和POST本质上就是TCP链接,并无差别。但是由于HTTP的规定和浏览器/服务器的限制,导致他们在应用过程中体现出一些不同

  • GET产生一个TCP数据包;POST产生两个TCP数据包

参考:99%的人都理解错了HTTP中GET与POST的区别

在input里,name 有什么作用?

  • name属性为input元素设定名称,当数据提交到数据库中会显示name:data
  • 在单选复选选框中,设置相同name的选项为一组选项

radio如何分组?

上一个问题已回答:在选择框中,设置相同name的选项为一组选项
例如:

<input type=radio name=sex1 value=男>
<input type=radio name=sex1 value=女>
<input type=radio name=sex2 value=攻>
<input type=radio name=sex2 value=受>

其中男、女为一组选项,攻、受为一组选项

placeholder 属性有什么作用?

placeholder属性能够让你在文本框里显示提示信息,一旦你在文本框里输入了什么信息,提示信息就会隐藏

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

  • 隐藏域在页面中对于用户是不可见的,在表单中插入隐藏域的目的在于收集或发送信息,以利于被处理表单的程序所使用
  • 收集用户身份信息
  • 区分多个提交按钮
  • 连接同一个页面中的多个form,起到一次性提交同一页面中所有form的效果
  • 存储全局变量

参考:html hidden隐藏域作用及用法实例介绍

写一篇博客简单介绍 HTML 表单的用法

HTML表单的用法简述

实现如下表单,附上预览地址。其中性别和取向是单选,爱好是多选

实现地址

推荐阅读更多精彩内容