Ajax：Serialize 和 FormData

1.Serialize

将表单内容拼接成字符串类型的参数 name=张三&age=10 这种形式

 <form id="form"><input type="text" name="username"><input type="password" name="password"><input type="submit" value="提交"></form>//js代码：$('#form').on('submit', function () {
    // 将表单内容拼接成字符串类型的参数var params = $('#form').serialize();console.log(params)  //阻止提交return false;});

2.FormData

1.自动将表单对象中的数据拼接成请求参数的格式
2.异步传输二进制文件（解决了ajax不能传输文件的弊端）

<!-- 创建普通的html表单 --><form id="form"><input type="text" name="username"><input type="password" name="password"><input type="button" id="btn" value="提交"></form><script type="text/javascript">// 获取按钮var btn = document.getElementById('btn');// 获取表单var form = document.getElementById('form');// 为按钮添加点击事件btn.onclick = function () {
    // 将普通的html表单转换为表单对象var formData = new FormData(form);// 创建ajax对象var xhr = new XMLHttpRequest();// 对ajax对象进行配置xhr.open('post', 'http://localhost:3000/formData');// 发送ajax请求xhr.send(formData);// 监听xhr对象下面的onload事件xhr.onload = function () {
    // 对象http状态码进行判断if (xhr.status == 200) {
    console.log(xhr.responseText);}}}</script>