函數 var value = document.getElementById(id).files[0] 在 JavaScript 中有什么作用？

Question

我正在使用 Brackets 軟件編碼 JavaScript。 我遇到了這個

var value = document.getElementById(id).files[0] 

我想知道是否有人可以解釋它的功能是什么以及我將來如何使用它以及.file[0]的意義是什么

Answer 1

來自Forms Section 4.10.5.4的 HTML5 規范：

files IDL 屬性允許腳本訪問元素的選定文件。 在獲取時，如果 IDL 屬性適用，它必須返回一個 FileList 對象，表示當前選定的文件。 必須返回相同的對象，直到所選文件的列表發生更改。 如果 IDL 屬性不適用，則它必須改為返回 null。

基本上.files返回腳本可以訪問的選定文件的列表（ FileList ）。

Answer 2

根據 W3Schools 的說法， files 屬性返回一個 FileList 對象，表示使用文件上傳按鈕選擇的一個或多個文件。

通過 FileList 對象，可以獲取文件的名稱、大小和內容

此屬性是只讀的。 您可以在此處的W3schools 網站上閱讀更多相關信息

你也可以在這里學習如何使用它

Answer 3

document.getElementById(id) 會給你一個普通的 JS 對象，它可以同時具有屬性（或屬性）和方法。 首先，您要求的指令是期望此對象具有“文件”屬性。

javascript 中的屬性可以是基元（如字符串、數字或布爾值）、復雜對象和數組。

在這種情況下，括號提示我們這個屬性（文件）是一個數組。 數組元素通過方括號內的索引訪問。 .files[0] 表示該數組中的第一項。

例如，如果你有一個像這樣的數組：

var myArray = ['first', 'second', 'last']

您可以使用您要求的相同語法訪問元素：

myArray[0]  //first
myArray[1]  //second
myArray[2]  //last

在不知道指令上下文的情況下，此文件屬性與 FileUpload 輸入控件完美匹配。 在這里檢查： https : //www.w3schools.com/jsref/dom_obj_fileupload.asp