Skip to content

artifact-project/morph

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 
 
 

Repository files navigation

🦠morph

It's a micro library for DOM patching.

npm i --save-dev @artifact-project/morph

Usage

HTML: <div id="root">Loading...</div>

import { morph } from '@artifact-project/morph';
// OR import { morph } from '/node_modules/@artifact-project/morph/index.js';

const root = document.getElementById('root');
const render = (name = '%username%') => {
	morph(root, `<h1>${name}</h1>`);
};

render(); // [replace node]: "Loading..." -> <h1/>
          // [create & append]: "%username%" (into <h1/>)

render("I'm is morph!"); // [update nodeValue]: "%username%" -> "I'm is morph!"

API

morph(root, content): boolean

Returns true, if a DOM will be changed.

  • root: HTMLElement
  • content: string | HTMLElement

Development

  • npm publish --access public

About

🦠It's a micro library for DOM patching

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published