Hello World
Your first hyperscript.
This example demonstrates the most basic hyperscript pattern: listening for a click event
and updating the DOM.
on click
put
event handling
Output appears here
The Code
<button
_=
"on click put 'Hello, LokaScript' into #output">
Click
</button>
<div
id=
"output"></div>
How it works:
_="..." - The hyperscript attributeon click - Listen for click events on this buttonput 'Hello, LokaScript' - The value to insertinto #output - Target the element with id="output"
Key Concepts:
- Event Handling:
on [event] sets up event listeners
- DOM Updates:
put [value] into [target] updates content
- CSS Selectors:
#output uses standard CSS selector syntax
- Declarative: Describe what should happen, not how to do it
Try it yourself:
Modify the hyperscript to change different parts:
- Change the message to your own text
- Try
on mouseover instead of on click
- Use
append instead of put to add text