update README
This commit is contained in:
16
README.md
16
README.md
@@ -3,7 +3,7 @@
|
|||||||
[](https://travis-ci.org/rrweb-io/rrweb-snapshot)
|
[](https://travis-ci.org/rrweb-io/rrweb-snapshot)
|
||||||
|
|
||||||
Snapshot the DOM into a stateful and serializable data structure.
|
Snapshot the DOM into a stateful and serializable data structure.
|
||||||
Also provide the ability to rebuild the DOM via snapshot.
|
Also, provide the ability to rebuild the DOM via snapshot.
|
||||||
|
|
||||||
## API
|
## API
|
||||||
|
|
||||||
@@ -13,22 +13,22 @@ This module export following methods:
|
|||||||
|
|
||||||
`snapshot` will traverse the DOM and return a stateful and serializable data structure which can represent the current DOM **view**.
|
`snapshot` will traverse the DOM and return a stateful and serializable data structure which can represent the current DOM **view**.
|
||||||
|
|
||||||
There are serveral things will be done during snapshot:
|
There are several things will be done during snapshot:
|
||||||
|
|
||||||
1. Inline some DOM states into HTML attributes, e.g, HTMLInputElement's value.
|
1. Inline some DOM states into HTML attributes, e.g, HTMLInputElement's value.
|
||||||
2. Turn script tags into noscript tags to avoid scripts being executed.
|
2. Turn script tags into `noscript` tags to avoid scripts being executed.
|
||||||
3. Try to inline stylesheets to make sure local stylesheets can be used.
|
3. Try to inline stylesheets to make sure local stylesheets can be used.
|
||||||
4. Make relative paths in href, src, css to be absolute paths.
|
4. Make relative paths in href, src, CSS to be absolute paths.
|
||||||
5. Give a id to each Node, and return the id node map when snapshot finished.
|
5. Give an id to each Node, and return the id node map when snapshot finished.
|
||||||
|
|
||||||
#### rebuild
|
#### rebuild
|
||||||
|
|
||||||
`rebuild` will build the DOM according to the taken snapshot.
|
`rebuild` will build the DOM according to the taken snapshot.
|
||||||
|
|
||||||
There are serveral things will be done during rebuild:
|
There are several things will be done during rebuild:
|
||||||
|
|
||||||
1. Add data-rrid attribute if Node is an Element.
|
1. Add data-rrid attribute if the Node is an Element.
|
||||||
2. Create some extra DOM node like text node to place inline css and some states.
|
2. Create some extra DOM node like text node to place inline CSS and some states.
|
||||||
3. Add data-extra-child-index attribute if Node has some extra child DOM.
|
3. Add data-extra-child-index attribute if Node has some extra child DOM.
|
||||||
|
|
||||||
#### serializeNodeWithId
|
#### serializeNodeWithId
|
||||||
|
|||||||
Reference in New Issue
Block a user