FormData的主要用途有两个:
- 将form表单元素的name与value进行组合,实现表单数据的序列化,从而减少表单元素的拼接,提高工作效率。
- 异步上传文件
创建formData对象
| // 创建formData数据对象 |
| var formdata=new FormData(); |
| // 追加数据 |
| formdata.append("name","laotie"); |
| // 读取数据 |
| console.log(formdata.get("name")); |
| // 修改数据 |
| formdata.set("name","laoliu"); |
| // 获取key为age的所有值,返回值为数组类型 |
| formdata.getAll("age"); // ["laoliu", "laoli", "laotie"] |
| // 判断存在对应key的值 |
| console.log(formdata.has("name")); // true |
| // 删除数据 |
| formdata.delete("name"); |
| // 发送数据 |
| var formdata=new FormData(document.getElementById("advForm")); |
| var xhr=new XMLHttpRequest(); |
| xhr.open("post","http://127.0.0.1/adv"); |
| xhr.send(formdata); // 发送 |
| xhr.onload=function(){ |
| if(xhr.status==200){ |
| //... |
| } |
| } |
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· Manus的开源复刻OpenManus初探
· AI 智能体引爆开源社区「GitHub 热点速览」
· 从HTTP原因短语缺失研究HTTP/2和HTTP/3的设计差异
· 三行代码完成国际化适配,妙~啊~