Skip to content

💥 convert virtual DOM nodes into HTML elements

License

Notifications You must be signed in to change notification settings

semibran/manifest

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

8 Commits
 
 
 
 
 
 
 
 

Repository files navigation

manifest

convert virtual DOM nodes into HTML elements

let heading = manifest({
  tag: "h1",
  attributes: { class: "foo" },
  children: [ "hello world" ]
})

document.body.appendChild(heading)
console.log(document.body.outerHTML)
// <body><h1 class="foo">hello world</h1></body>

We can extend the definition of a virtual node as specified by hyper2/h2spec to cover primitive values. Doing so enables us to create "text nodes" out of raw strings, numbers, etc. and greatly simplifies vnode conversion. When used with primitive values, this function is practically equivalent to calling document.createTextNode, as in the following (impractical) example:

let foo = manifest("foo")
let bar = document.createTextNode("bar")
document.body.appendChild(foo)
document.body.appendChild(bar)
console.log(document.body.outerHTML)
// <body>foobar</body>

usage

npm badge

To use this module in your project, package your code together using a bundler like rollup together with rollup-plugin-node-resolve.

related

About

💥 convert virtual DOM nodes into HTML elements

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published