JavaScript Open file
In this section, you will learn how to open and read the file in JavaScript.
You can see in the given example, we have created a file component to let the user select the file to be read and a button to submit the request. For this, we have used <input type="file">, through which we can browse the file and get the appropriate file to read. On clicking the "Open File" button, the function openFile() is called where we have used the JavaScript property window.location, which allows to access the selected file. The document.form.selectedFile.value display the text of the selected file on the browser.
Here is the code:
| <html> <h2>Read File in Javascript</h2> <script language="JavaScript"> function openFile() { window.location= 'file:///' + document.form.selectedFile.value; } </script> <body> <form name="form"> <input type="file" name="selectedFile"> <input type=button onClick="openFile()" value="Open File"> </form> </body> </html> |
Output will be displayed as:
Now click the browse button and select the file:

When you click the Open File button, you will get the text of the selected file:

Tutorials
- Java 26 (JDK 26) Features with examples
- Top 10 Reasons to Learn Java in 2026
- JDK 26 Tutorial
- Java Certification Roadmap 2026: Which Oracle Certs Matter
- Install JDK 26: A Complete Beginner's Guide (2026)
- What Is Java? A Complete, Up-to-Date Guide for 2026
- Java 26 HTTP3 tutorial - HTTP 3 support in JDK 26 - How to use HTTP/3 in Java 26 application?
- JDK 28 Preview: Value Objects, Shenandoah GC & JSON API
- Java Tutorials


