html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Simple Text Editor</title>
<link rel="stylesheet" href="./style.css" />
</head>
<body>
<div>
<p><button id="open" onclick="openFile()"> to open a file </button> | <button id="save" onclick="saveFile()" style="display:none"> to save a file </button></p>
</div>
<br />
<textarea name="" id="editor" cols="80" rows="10"></textarea>
<script src="./index.js"></script>
</body>
</html>
Javascript
let fileHandle
const textarea = document.querySelector("textarea")
async function openFile() {
const [handle] = await window.showOpenFilePicker()
fileHandle = handle
const file = await handle.getFile()
const text = await file.text()
textarea.value = text
document.getElementById("save").style = 'display:block';
}
async function saveFile() {
const writable = await fileHandle.createWritable()
await writable.write(textarea.value)
await writable.close()
}
No comments:
Post a Comment