Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
Selected Reading
JavaScript WebAPI File File.size Property
The JavaScript File WebAPI file.size property returns the size of file in bytes.
Following is the code for the File WebApi File.size property −
Example
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
body {
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
.result {
font-size: 18px;
font-weight: 500;
color: red;
}
</style>
</head>
<body>
<h1>JavaScript file.size property</h1>
<div class="result"></div>
<input type="file" class="fileInput" />
<h3>
Upload a file using the above input type to get its file size
</h3>
<script>
let resultEle = document.querySelector(".result");
document
.querySelector(".fileInput")
.addEventListener("change", (event) => {
resultEle.innerHTML += "File name = " + event.target.files[0].name + ‘<br>;
resultEle.innerHTML += "File size = " + event.target.files[0].size + ' bytes ';
});
</script>
</body>
</html>
Output
On clicking the ‘Choose file’ button and selecting a file −
Updated on: 2020-05-06T11:55:32+05:30
123 Views
Advertisements