有了FormData()，可以帮助操作form表单。FormData对象可以直接通过send传递。

无需获取表单控件的值，也无需拼接表单控件的name和其对应的值。

页面结构：

<!-- 无需action属性和method属性，因为做的是ajax请求，可以在ajax中去设置 -->
<form id="form1">
        <input type="text" name="username">
        <input type="text" name="password">
        <!-- 提交按钮不是submit类型，submit的点击意味着有默认行为，会去找action -->
        <input id="btn" type="button" value="提交">
</form>

1、将普通的html表单转换为表单对象

var form1 = document.getElementById('form1');
var formData = new FormData(form1);

2、获取表单项的内容（提供formData.get('key')获取name为key的表单项的值）

formData.get('username');
formData.get('password');

3、设置表单项的内容（提供formData.set('key','value')将name为key的表单项值设为value）

      存在这个属性则进行修改；不存在这个属性则进行创建

formData.set('username', 'xx');

4、追加表单项（提供formData.append('key','value')创建表单项sex赋值为value）

formData.append('sex','boy');

5、删除表单项（提供formData.delete('key')删除name为key的表单项）

formData.delete('password');

6、append和set方法有所区别：

      append方法会保留之前的值，set方法会将原来的值覆盖掉

      提供getAll(‘key’)方法对name为key的表单项的所有的值进行获取

// 创建空的表单对象，并向空表单中加入数据
var f = new FormData();
f.append('sex', '男');
f.append('sex', 'boy');
f.append('sex', 'not girl');

console.log(f.get('sex'));

console.log(f.getAll('sex'));

可以发现：一个已存在的项，append追加的值会添加至值的最末尾

                  get()只能获取一个值，也是第一个值；getAll()可以获取所有的值。