https://github.com/swimyoung/dom-serialization

DOM serialization
https://github.com/swimyoung/dom-serialization

Last synced: about 2 months ago
JSON representation

DOM serialization

• Host: GitHub
• URL: https://github.com/swimyoung/dom-serialization
• Owner: swimyoung
• Created: 2019-03-10T09:04:17.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2024-06-17T23:52:18.000Z (3 months ago)
• Last Synced: 2024-07-22T04:38:44.459Z (2 months ago)
• Language: TypeScript
• Homepage:
• Size: 465 KB
• Stars: 3
• Watchers: 1
• Forks: 0
• Open Issues: 2
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# DOM Serialization

Serialize the DOM

Q. Why don't you use innerHTML?

: when you use innerHTML you lose tree structure if there are adjacent text nodes.

```txt

            span

          /       \

  text node       text node

```

dom-serialization serialize the DOM with keeping tree structure. So you can keep tree structure when you deserialize from serialized string.

## Getting started

```sh

npm install dom-serialization

```

```js

import { serialize, deserialize } from 'dom-serialization';

const dom = document.createElement('div');

dom.appendChild(document.createTextNode('hello'));

dom.appendChild(document.createTextNode('world'));

const code = serialize(dom);

console.log(deserialize(code));

```