表单标签＜form＞和表格标签＜table＞

表单标签<form>

  1、定义：表单标签用于创建供用户输入的 HTML 表单。
  2、使用：标签中可包含一个或多个表单元素
  3、常见表单元素：<input>,<option>,<select>,<button>,<textarea>
  4、注意：一般情况下我们会用使用axios方法将数据提交给服务端，但是axios默认数据类型是json格式，而<form>标签封装的数据格式是表单格式，如果不修改在跨域时会出现问题。故
（1）方法一：导入qs库，将表格形式的数据类型转成json格式

                   this.$http.post('/user/login', this.$qs.stringify(this.loginForm)
						).then(res => {
							if(res.status != 200)return this.$message.error("登录失败")
							this.$message.success("登录成功")
							// 1、将登录成功之后的token保存到客户端的sessionStrage[]
							//   1.1 项目中出了登录之外的其他挨批接口，必须在登录时才能访问
							//   1.2 token只应在当前网站打开期间生效，所以token要保存在sessionStrage[]
							window.sessionStorage.setItem('token', res.data.token)
							console.log(res.data.token)
							// 2、通过编程式导航跳转到后台主页，路由地址是/home
							this.$router.push('/home') 
					}).catch(err => {
						console.log(err)
					})`

（2）将axios的信息头的传输数据的类型改成application/x-www-form-urlencoded

输入标签<input>

  1、定义：规定了用户可以在其中输入数据的输入字段。
  2、使用：<input>标签一般与<form>成对出现，用来声明允许用户输入数据的 input 控件。输入字段可通过多种方式改变，取决于 type 属性。
  3、常用属性：type、method、required、formenctype、formmethod、formaction、accept等
  4、与<button>标签的区别：
（1）<input>标签是单个标签，而<button>标签使用时必须以</button>结束
（2）<input>不可在标签内添加样式，而<button>可以添加
（3）需要给<input  type=“button”>添加按钮名称需要在其添加value属性，而<button>可直接写在标签内部
（4）<button>标签可嵌套其他元素，而<input>不可

表格标签<table>

  1、定义：一般用于创建规整化表格
  2、使用：一个<table>可包含一个或多个<tr>,<td>,<th>,<tb>标签，其中<tr>标签定义表格行，<td>标签定义表格列，<th>标签定义表头；<tb>标签定义表格单元
  3、常用属性：border：规定表格是否有边框。

区别

1、<form>标签一般用于封装数据，<table>标签一般用于布局设计
2、应用范围不同：
（1）<form>标签一般是将数据统一发送到服务器，比较常见的是登录注册功能，点击提交后，<form>标签封装数据并提交，若不点击则不会提交。
（2）<table>标签一般用于静态页面展示，比如个人简历的展示。

（3）<form>标签内文本框及其文本内容不会整齐排布，故一般情况下会在<form>标签内嵌套一个<table>标签