form表单

Question

上传图片

<input id="file" type="file" accept="image/*" multiple="" name="file">

<script>

let formData = new FormData();
let element = document.getElementById("file");
element.addEventListener('change', function () {
    //获取元素对象
    console.log(this);
    //选中的文件
    console.log(this.files);
    formData.append('file',this.files);
    console.log(formData);
    （AJAX）
    });

</script>

或

<form id="upload">

<input id="file" type="file" accept="image/*" multiple="" name="file">

</form>

<script>

let element = document.getElementById("file");
element.addEventListener('change', function () {
    let formData1 = new FormData(document.getElementById('file'));
    let formData2 = new FormData(document.getElementById('upload'));
    console.log(formData1);
    console.log(formData2);
    （AJAX）
    });

</script>

问:
formData1与formData2是一样的么？
上述两种方法都可以上传图片么？
上传图片input必须放在form里面么？
表单必须放在form里面么？

Answer 1

1、不一样 formdata对应是form标签
2、formdata2可以
3、不一定 可以通过动态获取file然后append进formdata对象中
4、不一定，如果想不通过append就需要

因为formdata对应form标签下面的表单 同时必须含有name属性才会被formdata到