FormData js对象的介绍和使用

时间：2022-02-24 05:20:43

FormData js对象的介绍和使用

FormData对象，可以把所有表单元素的name与value组成一个queryString,提交到后台。 在使用ajax提交时，使用FormData对象可以减少拼接queryString的工作量（queryString是查询字符串，http查询字符串由url中？后面的值指定）

当页面上的form以GET方式向页面发送请求数据时 (如数据含有不安全字符，则浏览器先将其转换成16进制的字符再传送，如空格被转换成%20时 ) ,web server 将请求数据放入一名为QUERY_STRING的环境变量中。    Request.QueryString  方法是从这一环境变量中取出相应的值，并将被转成16进制的字符还原

FormData

1. 概述

FormData 对象的使用：

1.用一些键值对来模拟一系列表单控件：即把form中所有表单元素的name与value组装成

一个queryString

2. 异步上传二进制文件。

　

2、属性

1. FormData对象的操作方法，可以在原型中查看

FormData js对象的介绍和使用

3、用法

创建一个formData对象实例有几种方式

1、创建一个空对象实例

var formData = new FormData();

此时可以调用append()方法来添加数据

2、使用已有的表单来初始化一个对象实例

假如现在页面已经有一个表单

<form id="myForm" action="" method="post">

    <input type="text" name="name">名字

    <input type="password" name="psw">密码

    <input type="submit" value="提交">

</form>

　　

我们可以使用这个表单元素作为初始化参数，来实例化一个formData对象

// 获取页面已有的一个form表单

var form = document.getElementById("myForm");

// 用表单来初始化

var formData = new FormData(form);

// 我们可以根据name来访问表单中的字段

var name = formData.get("name"); // 获取名字

var psw = formData.get("psw"); // 获取密码

// 当然也可以在此基础上，添加其他数据

formData.append("token","kshdfiwi3rh");

　　（文章参考自：https://segmentfault.com/a/1190000012327982  https://blog.csdn.net/saharalili/article/details/79002568）

　

相关文章