<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script src="script.js"></script>
</head>
<body>
<h2>Microsoft Word Document Count Words! Using JavaScript?</h2>
<input type="file" accept=".doc,.txt,.docx" onchange="calculateWords()" id="textDoc"/>
<div>
<h1 id="fileInformation">File word Count after choose</h1>
</div>
</body>
</html>
// Code goes here
function calculateWords() {
if (window.File && window.FileReader && window.FileList && window.Blob) {
console.log("words");
var doc = document.getElementById("textDoc");
var f = doc.files[0];
//var f = event.target.files[0];
//do your stuff!
if (!f) {
alert("Failed to load file");
//validate file types yet to come
} else if (false) {
alert(f.type + " is not a valid text file.");
} else {
var r = new FileReader();//create file reader object
r.readAsText(f);//read file as text
//attach function to execute when loading file finishes.
r.onload = function (e) {
var contents = e.target.result;
var res = contents.split(" ");
console.log(res.length);
var fileInformation = "word Count = "+res.length;
var info = document.getElementById("fileInformation");
info.innerHTML = fileInformation;
}
}
} else {
alert('The File APIs are not fully supported by your browser.');
}
}
/* Styles go here */