arrosoir
v1.0.2
Published
A function for basic DOM hydration
Downloads
1
Maintainers
Readme
Arrosoir
Small DOM hydration function for generated HTML.
Install
npm install arrosoir
Usage
import { hydrate } from 'arrosoir'
await hydrate(selector, url)
For example:
<script type="module">
import { hydrate, params } from 'https://cdn.skypack.dev/arrosoir'
const search = params(location.href)
search.l ??= 10
search.p ??= 0
document.querySelector('button.load-more').addEventListener('click', async () => {
search.p++
await hydrate('ul.list', search.apply(location.href), { merge: true })
})
</script>
The previous example fetches the page with a different query string. The
hydrate
function will merge the new HTML into the existing DOM.
Options
merge
: Append the new HTML to the selector.history
: Replace the current URL with the fetched one.