Save textarea content to local file using file system access API [ demo & source code ]

<button id="saveas"> save as</button> <textarea id="textarea" style="width:100%;height:300px">Free Online HTML editor autocomplete with CSS & JS</textarea> <script> document.getElementById("saveas").onclick = function() { saveFile() } async function saveFile() { const opts = { types: [{ description: 'html file', accept: {'text/html': ['.html']}, }], }; const newHandle = await window.showSaveFilePicker(opts); // create a FileSystemWritableFileStream to write to const writableStream = await newHandle.createWritable(); var textarea =document.getElementById("textarea").value await writableStream.write(textarea); // close the file and write the contents to disk. await writableStream.close(); } </script> <button id="saveas"> save as</button>

<textarea id="textarea" style="width:100%;height:300px">Free Online HTML editor autocomplete with CSS & JS</textarea>

<script>
document.getElementById("saveas").onclick = function() {
saveFile()
}

async function saveFile() {
const opts = {
types: [{
description: 'html file',
accept: {'text/html': ['.html']},
}],
};
const newHandle = await window.showSaveFilePicker(opts);

// create a FileSystemWritableFileStream to write to
const writableStream = await newHandle.createWritable();

var textarea =document.getElementById("textarea").value
await writableStream.write(textarea);

// close the file and write the contents to disk.
await writableStream.close();
}

</script>


in this example i will be share with you how to can save text inside textarea tag in your local files as html file using file system access API

© 2025 Manajmnt code

Share to :

☷✎

Related

• How-to paste text from clipboard automatically onload page paste text,clipboard, javascript discover How-to paste text from clipboard automatically onloa… Read More
• Open file from local system and save changes to file that openedIn this code we will be learn how to use The File System Access API to open file from local system a… Read More
• display only 30 characters of a long string javascript in array //![CDATA[ var str=document.getElementsByClassName("post-title"); for (let… Read More