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
42 lines (37 loc) • 1.01 kB
HTML
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
body {
border: 2px solid black;
}
</style>
</head>
<body>
<div id="app">0</div>
<button id="button2">Click Me</button>
<button id="button2">Click Me</button>
<script type="module">
import { $, $$ } from "../index.js"
const buttons = $$("button")
const app = $("#app")
let count = 0
buttons.on("click", () => {
count++
app
.if({
is: () => count % 2 === 0,
then: (el) => el.text(count).css("color", "green"),
or: (el) => el.text(count).css("color", "red"),
})
.css({
backgroundColor: count % 2 === 0 ? "pink" : "yellow",
border: "2px solid black",
})
})
</script>
</body>
</html>