jessquery
Version:
Modern JavaScript is pretty good, but typing document.querySelector() is a pain. This is a tiny library that makes DOM manipulation easy. jQuery is around 80kb (30kb gzipped), while this is only around 8kb (3.5kb gzipped). Lots of JSDoc comments so it's s
38 lines (34 loc) • 1.04 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>File Reader</title>
</head>
<body>
<input type="file" class="file-input" />
<div class="display">File contents will appear here...</div>
<script type="module">
import { $, promisify } from "../index.js"
const readFile = promisify(
(resolve, reject, file) => {
const reader = new FileReader()
reader.onload = () => resolve(reader.result)
reader.onerror = () => reject(reader.error)
reader.readAsText(file)
},
10000,
{ fnName: "readFile" }
)
$(".file-input").on("change", (event) => {
const file = event.target.files[0]
if (file) {
$(".display")
.text("Reading file...")
.text(readFile(file))
.css("color", "green")
}
})
</script>
</body>
</html>