HTML | DOM Input FileUpload files Property

Last Updated : 25 Aug, 2022

The Input FileUpload files Property in HTML DOM is used to return a FileList object, representing one or multiple files selected with the file upload button and This is a read-only property.
Through the FileList object, you can get the information about the files.
Syntax:

fileuploadObject.files

Return Values : It returns a FileList object which represent the selected file or files.

Examples:

html

<!DOCTYPE html>
<html>
 
<head>
    <title>
      Input FileUpload files Property
  </title>
</head>
 
<body onload="myFunction()">
    <center>
        <h1 style="color: green">
          GeeksforGeeks
      </h1>
         
 
<p>
            <b>
            DOM Input FileUpload files Property
          </b>
        </p>
 
 
        <input type="file"
               id="myFile"
               multiple size="50"
               onchange="myFunction()">
 
        <p id="demo"></p>
 
 
 
        <script>
            function myFunction() {
                var GFG =
                    document.getElementById("myFile");
                var msg = "";
                if ('files' in GFG) {
                    if (GFG.files.length == 0) {
                        msg =
                            "Select multiple files using" +
                            " 'Shift'.";
                    } else {
                        for (var i = 0; i < GFG.files.length; i++) {
 
                            msg += "<br><strong>" + (i + 1) +
                                ". file</strong><br>";
 
                            var file = GFG.files[i];
                            if ('name' in file) {
                                msg += "name: " + file.name + "<br>";
                            }
                            if ('size' in file) {
                                msg += "size: " + file.size +
                                    " bytes <br>";
 
                            }
                        }
                    }
                } else {
                    if (GFG.value == "") {
                        msg += "Select multiple" + 
                          " files using 'Shift'.";
                       
                    } else {
                        msg += "This file property" + 
                          " is not supported!!";
                       
                        /* If the browser does not
                        support the files property,
                        it will return the path of
                        the selected file instead. */
                        msg += "<br>The path of the " + 
                          "selected file: " + GFG.value;
                    }
                }
                document.getElementById("demo").innerHTML = msg;
            }
        </script>
    </center>
</body>
 
</html>