找出什么是FileList对象以及如何使用它
当你有一个带有<input type="file" /> 元素的HTML表单时，当一个或多个文件被用户上传时，你将与一个FileList 对象交互。
这并不是唯一可以给你一个FileList 对象的地方。你在与拖放互动时也会得到一个。
坚持使用表单，默认的输入类型不允许上传多个文件。
你将检索到一个只有一个元素的FileList，你可以使用这个语法来检索它。
const input = document.querySelector('input')
input.addEventListener('change', e => {
const fileList = input.files
const theFile = fileList[0]
})
从FileList 对象中选择任何元素都会得到一个 File对象。在这种情况下，我们只有一个，所以我们选择位置为0的项目。
你也可以使用item() 方法检索它，指定索引。
const input = document.querySelector('input')
input.addEventListener('change', e => {
const fileList = input.files
const theFile = fileList.item(0)
})
如果多个被启用，尽管使用multiple 属性 (<input type="file" multiple />)，FileList将包含多个元素。
你可以通过查看FileList 的length 属性来获得计数。
这个例子加载了上传的文件，并对其进行迭代以打印每个文件的名称。
<input type="file" multiple />
const input = document.querySelector('input')
input.addEventListener('change', e => {
const files = input.files
const filesCount = fileList.length
for (let i = 0; i < files.length; i++) {
const file = files[i]
alert(file.name)
}
})
