JavaScriptやjQueryでファイルオブジェクトを取得する方法

jQueryやJavaScriptでHTMLのinputタグのファイルタイプで指定されたファイルをFileAPIで読み込むためのファイルオブジェクトの取得方法を記録しておきます。

まずはHTML

<input type="file" id="inputFile">

jQueryを使ってファイルオブジェクトを取得する場合

var file = $('#inputFile')[0].files[0];
if(!file) {
  alert('ファイルが設定されていません'); 
}

次にjavaScriptでファイルオブジェクトを取得する場合

var file = document.querySelector('#inputFile').files[0];
if(!file) {
  alert('ファイルが設定されていません'); 
}