elevatedjs v0.0.7-0

ElevatedJS

ElevatedJS is a Micro Javascript Framework to bring reactivity to web directly in html.

Including ElevatedJS

Below are some ways to include ElevatedJS.

Script tag

Include the newest version

<script src="https://unpkg.com/elevatedjs"></script>

Usage

data-set

create a variable by passing JSON data to data-set attribute.

<div data-set='{ "name": "bob", "age": 987 }'></div>

data-text

set innerHTML of an element by passing variable name to data-text attribute.

<div data-set='{ "name": "bob", "age": 987 }'></div>

<span data-text="name"></span>
<h1 data-text="age"></h1>

data-model

create a two way binding on input element by passing variable name to data-model attribute.

<div data-set='{ "name": "bob" }'></div>

<input type="text" data-model="name"></input>
<span data-text="name"></span>

data-on

bind event listener to an element by passing a function to data-on attribute and specifying the event name after :. Variables can be accessed using global LVT object inside the function.

<div data-set='{ "name": "bob" }'></div>

<button data-on:click="()=>{ alert(LVT.name) }">click</button>

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

License

MIT