I got a small script to split the text inside 'var foo' after every 4 characters. It is working fine. but my actual data is in a text file say 'a.txt'. How do I take this entire file text in 'var foo'. and write the split output to another text file?
var foo = "this is sample text !!!";
var arr = [];
for (var i = 0; i < foo.length; i++) {
if (i % 4 == 0 && i != 0)
arr.push(foo.substring(i - 4, i));
if (i == foo.length - 1)
arr.push(foo.substring(i - (i % 4), i+1));
}
document.write(arr);
console.log(arr);
I got a small script to split the text inside 'var foo' after every 4 characters. It is working fine. but my actual data is in a text file say 'a.txt'. How do I take this entire file text in 'var foo'. and write the split output to another text file?
var foo = "this is sample text !!!";
var arr = [];
for (var i = 0; i < foo.length; i++) {
if (i % 4 == 0 && i != 0)
arr.push(foo.substring(i - 4, i));
if (i == foo.length - 1)
arr.push(foo.substring(i - (i % 4), i+1));
}
document.write(arr);
console.log(arr);
- possible duplicate of How to read and write into file using JavaScript – Chase Commented Apr 25, 2013 at 12:22
- I can't see any significant relation among question title, description, and the provided code. Please try to explain the context of your question like where are you trying to execute this code, in a browser, a native app developed in JS or a server. – saurav Commented Oct 14, 2016 at 16:50
2 Answers
Reset to default 9To get the content of the file you need to select a file using an input tag.
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
</head>
<body>
<input id="input" type="file" accept="text/plain">
<script src="script.js"></script>
</body>
A good moment to read the content of the file is in the change event.
const input = document.querySelector("#input");
input.addEventListener("change", () => {
const file = input.files.item(0);
});
To read the content of the file as a string you need to convert it.
function fileToText(file, callback) {
const reader = new FileReader();
reader.readAsText(file);
reader.onload = () => {
callback(reader.result);
};
}
The content of the file as a string will be available to the the callback function. You can create a link and use the click event to download the string into a text file.
function save(content, fileName, mime) {
const blob = new Blob([content], {
tipe: mime
});
const url = URL.createObjectURL(blob);
const a = document.createElement("a");
a.href = url;
a.download = fileName;
a.click();
}
Here is the complete code
const input = document.querySelector("#input");
input.addEventListener("change", () => {
const file = input.files.item(0);
fileToText(file, (text) => {
save(text, "fileName.txt", "text/plain");
});
});
function fileToText(file, callback) {
const reader = new FileReader();
reader.readAsText(file);
reader.onload = () => {
callback(reader.result);
};
}
function save(content, fileName, mime) {
const blob = new Blob([content], {
tipe: mime
});
const url = URL.createObjectURL(blob);
const a = document.createElement("a");
a.href = url;
a.download = fileName;
a.click();
}<!DOCTYPE html>
<head>
<meta charset="UTF-8">
</head>
<body>
<input id="input" type="file" accept="text/plain">
<script src="script.js"></script>
</body>You can read more about manipulating files in JavaScript here: https://www.html5rocks.com/en/tutorials/file/dndfiles/
Solution to this helped me :
How do I load the contents of a text file into a javascript variable?
var client = new XMLHttpRequest();
client.open('GET', '/foo.txt');
client.onreadystatechange = function() {
alert(client.responseText);
}
client.send();