在前后端交互的过程中,除了ajax请求之外,最常见的就是表单请求了。
由于form表单属性多,表单标签内容多且复杂,不深究的话很难全面的弄明白。
接下来就来详细的说一说整个form表单都有些什么,并且如何去使用。
(一)form表单标签内的属性
1.最重要的两个属性:action method
action:指定一个URL地址用于向该地址发送表单数据;
method:规定是按照何种方式发送数据;
method可以填的值如下:
get:以get方式请求,表单数据会以?连接数据放在URL内一并发送,每组数据直接用&连接。这种方式不安全,容易被截取。
post:以post发送请求,表单数据会以一个对象的方式放在请求体中进行发送。
//在前端中最常见的两个请求方式就是get 和 post 。get和post其实两个方法都差不多的。对于前端发送数据给服务器而言多半用post请求
处于安全性考虑,post请求的安全性要高一些。
除了post和get还可以填:options head delete trace connect
这些请求方法需要服务器端的配合才可以,不同的类型对应这服务器不同的操作,对于前端而言很少用也不会让你这样乱用。在编程上与
post和get请求差不多。
<form action="https://www.w3school.com.cn/example/html5/demo_form.asp" method="PUT"> 姓名: <input type="text" name="name" /><br /> 年龄: <input type="text" name="arguments" /><br /> <input type="submit" value="Submit" /> </form>
用一下w3c的测试接口,服务器端没有限制请求类型
2.accept-charset 规定服务器处理表单数据所接受的字符集
accept-charset: 字符集名称
accept-charset:unknown (默认值) 表示表单的字符集与包含表单的文档的字符集相同。
<form action="https://www.w3school.com.cn/example/html5/demo_form.asp" method="POST" accept-charset="UTF-8" autocomplete="on" enctype="application/x-www-form-urlencoded" name="myForm" novalidate target="_blank"> 姓名: <input type="text" name="name" /><br/> 年龄: <input type="text" name="arguments" /><br/> <select name="" id=""> <option value="">123</option> <option value="">1231</option> <option value="">123211</option> <option value="">12312312</option> </select> <input type="submit" value="Submit" /> </form>
以上就是form标签的属性内容介绍,如果对内容有疑问欢迎来评论区进行交流讨论