入门5-From表单

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

HTML表单是一个包含各种表单元素的区域,用于收集用户提交的各种类型的的数据。
input标签使用type属性的值来规定input元素的类型,常见有以下类型:
- text -- 单行文本输入框
- textarea -- 多行文本域
- password -- 密码输入框,输入显示黑圆点
- checkbox -- 复选框
- radio -- 单选框
- file -- 输入字段和浏览按钮,用于文件上传
- button -- 普通按钮
- image -- 图片按钮
- submit -- 表单提交按钮,用于提交表单数据
- hidden -- 隐藏的输入字段
- reset -- 重置按钮,清除表单填写的所有数据


post 和 get 方式的区别?

  • GET一般用于获取/查询资源信息,而POST一般用于更新资源信息。
  • GET请求的数据会附在URL之后(就是把数据放置在HTTP协议头中),以?分割URL和传输数据,参数之间以&相连,如:login.action?name=hyddd&password=idontknow&verify=%E4%BD%A0%E5%A5%BD。POST把提交的数据则放置在是HTTP包的包体中。
  • GET方式提交的数据最多只能是1024字节,理论上POST没有限制,可传较大量的数据,IIS4中最大为80KB,IIS5中为100KB
  • POST的安全性要比GET的安全性高。举例:通过GET提交数据,用户名和密码将明文出现在URL上,因为(1)登录页面有可能被浏览器缓存,(2)其他人查看浏览器的历史纪录,那么别人就可以拿到你的账号和密码了,除此之外,使用GET提交数据还可能会造成Cross-site request forgery攻击。

在input里,name 有什么作用?

  • 用POST或者GET方式提交数据时,name会和input中的值相对应,后端通过name获取相对于的input值。

radio 如何 分组?

  • radio设置相同的name属性名即为同一组,即通过设置不同的name。

placeholder 属性有什么作用?

  • 提供可描述输入字段预期值的提示信息,该提示会在输入字段为空时显示,并会在字段获得焦点时消失。
  • placeholder 属性适用于以下输入类型:text、search、url、tel、email 以及 password

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

  • type属性值定义为hidden可定义隐藏字段。隐藏字段对于用户是不可见的。隐藏字段通常会存储一个默认值,它们的值也可以由 JavaScript 进行修改。
    一方面隐藏数据可以暂存数据,例如用户不需要见到,但操作网页时可能用到的数据;另一方面可以提高安全性,例如,页面提交表单时可通过type=hidden设置一段隐藏的按照预先算法约定好的随机字段,服务器在受到表单数据时对这个隐藏字段进行校验,来识别该表单数据来源是否可靠,从而避免服务器数据被假页面提交的数据攻击篡改。

写一篇博客简单介绍 HTML 表单的用法,附上博客链接

HTML表单使用方法

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

入门5-From表单_第1张图片
图片

预览地址

你可能感兴趣的:(入门5-From表单)