1. dom-tree
DOM Manipulation Library
dom-tree
Package: dom-tree
Created by: npm-dom
Last modified: Wed, 15 Jun 2022 21:25:44 GMT
Version: 1.0.0
License: BSD
Downloads: 117
Repository: https://github.com/npm-dom/dom-tree

Install

npm install dom-tree
yarn add dom-tree

dom-tree

Library to manipulate DOM elements

Example:

 var dom = require('dom-tree')

dom.add(document.body, '<h1>{title}</h1>{content}', {
  title: 'Hello',
  content: 'Welcome!'
})

Install

 $ npm install dom-tree

API

add(element, child)

Adds child to el

 add(document.body, document.createElement('textarea'))
add('body .content', document.createElement('textarea'))
add('.content', '<div>hello</div>')
add('.content', '<h1>{title}</h1>', { title: 'Hello!' })

addAfter(parent, child, reference)

Similar to addBefore

addBefore(parent, child, reference)

 addBefore(document.body, document.createElement('textarea'), document.body.firstChild)
addBefore('body', '<h1>{msg}</h1>', { msg: 'foobar' }, document.body.firstChild)

insert(element, parent)

insert element to parent as child

 insert(document.createElement('textarea'), document.body)
insert('<input />', '.content')
insert('<h1>{title}</h1>', { title: 'hello' }, '.content')

replace(parent, target, replacement)

replace target with replacement

 replace(document.body, document.body.firstChild, document.createElement('textarea'))
replace('body .content', '.content ul', '<h1>hello</h1>')
replace('body .content', '.content ul', '<h1>{msg}</h1>', { msg: 'hello!' })

remove(element)

remove element

 remove(document.body.firstChild)
remove('body .content')

remove(parent, child)

remove child

 remove(document.body.firstChild, 'h1')

RELATED POST

10 Must-Know Windows Shortcuts That Will Save You Time

10 Must-Know Windows Shortcuts That Will Save You Time

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Arrays vs Linked Lists: Which is Better for Memory Management in Data Structures?

Navigating AWS Networking: Essential Hacks for Smooth Operation

Navigating AWS Networking: Essential Hacks for Smooth Operation

Achieving Stunning Visuals with Unity's Global Illumination

Achieving Stunning Visuals with Unity's Global Illumination

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code

Nim's Hidden Gems: Lesser-known Features for Writing Efficient Code