6

我开始使用 Javascript 并试图了解一些基础知识。这些问题并不是专门针对文件接口的，而是我想要弄清楚的。

在我的 HTML 文件中，我有一个文件类型输入。

<input type="file" id="fileInput" multiple/>

然后在我的 JS 文件中，我有：

var fileVar = document.getElementById('fileInput').files[0];

这可以正常工作，并且 filevar 的类型为File.

现在我试图了解files属性是如何工作的。

在 W3 中，API 定义为：

 interface FileList {
      getter File? item(unsigned long index);
      readonly attribute unsigned long length;
    };

我试图弄清楚如何使用files. 它似乎没有在任何地方定义。数组files从何而来？

4

1 回答 1

5

该files属性返回一个FileList.

files是HTMLInputElementInterface<input>的一个属性，即标签的 DOM 接口。它由支持 HTML5 File API 的浏览器实现。

要访问单个文件，您可以像任何其他列表/数组一样遍历它们。例如：

var files = element.files; //where `element` is a file input element reference
//`files` references a FileList, you can iterate over it and access its File objects
for (var i = 0; i < files.length; i++) {
    console.log('File '+ i +"'s name = " + files[i].name +
        '; size: ' + files[i].size + ' bytes');
}

演示

MDN 也有一个很好的使用 File API的教程。

于 2013-02-26T14:16:05.407 回答