Shulou(Shulou.com)06/01 Report--

This article mainly introduces html how to achieve single file upload, the article is very detailed, has a certain reference value, interested friends must read it!

Single file upload

We can specify the input type as file to use the file upload feature in Web applications.

Input filte provides buttons to upload one or more files. By default, it uploads single files using the operating system's native file browser. After a successful upload, File API makes it possible to read File objects using simple JS code. To read the File object, we need to listen for change events.

First, obtain an example of file upload through id:

Const fileUploader = document.getElementById ('file-uploader')

Then add a change event listener to read the file object after the upload is complete, and we get the uploaded file information from the event.target.files attribute:

FileUploader.addEventListener ('change', (event) = > {const files = event.target.files; console.log (' files', files);})

Looking at the output in the console, take a look at the FileList array and the File object, which has all the metadata information about the uploaded file.

The above is all the contents of the article "how to upload a single file with html". Thank you for reading! Hope to share the content to help you, more related knowledge, welcome to follow the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.