A RetroSearch Logo

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Search Query:

Showing content from https://developer.cdn.mozilla.net/ja/docs/Web/API/HTMLInputElement/files below:

HTMLInputElement: files プãƒãƒ‘ティ - Web API

HTMLInputElement: files プロパティ

Baseline Widely available

HTMLInputElement.files プロパティを通じて、<input type="file"> 要素で選択された FileList にアクセスできます。

値

選択されているファイルがあれば、それをリストする FileList オブジェクトです。HTMLInputElement が type="file" でない場合は、null が返ります。

例

以下の例は、HTMLInputElement.files プロパティにアクセスして、ユーザーが選択したそれぞれのファイルの名前、更新日時、サイズ、種類を出力する方法を示します。

HTML
<input id="files" type="file" multiple />
JavaScript

HTMLInputElement.files は、ファイルが選択されていなくても FileList を返すことに注意してください。 この性質があるため、ファイルが選択されているかをチェックせずに for...of で走査しても安全です。

const fileInput = document.getElementById("files");

console.log(fileInput.files instanceof FileList); // 空でも true となる

for (const file of fileInput.files) {
  console.log(file.name); // ファイル名を表示
  let fileDate = new Date(file.lastModified);
  console.log(fileDate.toLocaleDateString()); // 日付を表示
  console.log(
    file.size < 1000 ? file.size : Math.round(file.size / 1000) + "KB",
  );
  console.log(file.type); // MIME タイプを表示
}
仕様書 ブラウザーの互換性 関連情報

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4