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
49 lines (45 loc) • 1.29 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Test fromJSON</title>
</head>
<body>
<div id="testDiv"></div>
<div id="testDiv"></div>
<script type="module">
import { $, $$ } from "../index.js"
$("#testDiv")
.text("Loading...")
.wait(1000)
.fromJSON(
"https://jsonplaceholder.typicode.com/todos/1",
async (element, data) => {
const { title, userId, id, completed } = data
element
.html(
`<h1>${title}</h1>
<p>userId: ${userId}</p>
<p>id: ${id}</p>
<p>completed: ${completed}</p>`
)
.addClass("updated")
.css("backgroundColor", "skyblue")
},
{
onWait: () => $("#testDiv").text("Waiting..."),
error: "I'M A CUSTOM ERROR",
onSuccess: () => $$("p").css("color", "green"),
}
)
.css("backgroundColor", "yellow")
</script>
<style>
.updated {
border: 1px solid red;
padding: 10px;
}
</style>
</body>
</html>