Jak uzyskać dostęp do pliku atrybut elementu pliku przy użyciu JavaScript

Question

Mam w mojej formie element wejściowy z typem pliku. Co chcę zrobić, to sprawdzić rozmiar pliku przed przesłaniem elementu w celu sprawdzenia poprawności. Korzystając z większości podstawowych przeglądarek internetowych (z wyjątkiem IE, który zawsze robi rzeczy trudniejsze), dowiaduję się, że wszyscy używają "atrybutu", który aktualizuje się, gdy wybieram nowy plik i wyświetla rozmiar pliku, a także inne użyteczne informacje.

Oto, co widzę w przeglądarce Chrome:

Teraz powstaje pytanie, w jaki sposób mogę uzyskać dostęp do tej wartości z JavaScript? Próbowałem na kilka sposobów, ale żaden nie był dla mnie dobry? Masz dobry pomysł?

UWAGA: Na mojej stronie używam jQuery, więc nie jest ważne, aby być zwykłym JavaScriptem.

poważaniem Merianos Nikos

Answer 1

//use any ol' selector to get the <input /> element: 
var inputElement = document.querySelector("input[type='file']"); 

//then it's just like you'd access any object's attributes: 
var fileSize = inputElement.files[0].size; 
//note that it's a list of files, so you can loop through them 
//in case the element accepts multiple files 

//if you want all of the attributes, do something like: 
for (var key in inputElement.files[0]) 
    if (inputElement.files[0].hasOwnProperty(key)) 
     console.log(key,inputElement.files[0][key]); 

Answer 2

czyli

$("#btStartUpload").on("click", function(evt) {   

    var filesSelected = document.getElementById('btInput').files; // FileList object 
    // var filesSelected = $('#btInput')[0].files; // with jQuery, any jQuery object have it's DOM element accessed using [0] 
    // var filesSelected = $('input[type=file]')[0].files; 
    console.log(filesSelected); 
});