https://github.com/0xedward/dom-visualizer
Visualize the DOM tree created by your browser for any HTML input
https://github.com/0xedward/dom-visualizer
Last synced: about 2 months ago
JSON representation
Visualize the DOM tree created by your browser for any HTML input
- Host: GitHub
- URL: https://github.com/0xedward/dom-visualizer
- Owner: 0xedward
- License: agpl-3.0
- Created: 2020-12-31T01:16:04.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2025-02-01T14:01:52.000Z (4 months ago)
- Last Synced: 2025-04-14T17:11:59.149Z (about 2 months ago)
- Language: JavaScript
- Homepage: https://0xedward.github.io/dom-visualizer/
- Size: 157 KB
- Stars: 6
- Watchers: 3
- Forks: 2
- Open Issues: 20
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# DOM Visualizer
[DOM Visualizer](https://0xedward.github.io/dom-visualizer/) was created for developers to view the DOM created by their browser for any HTML input. DOM Visualizer creates and displays the hierarchical relationship between different HTML tags.
# Supported Browsers
DOM Visualizer relies on the [DOMParser API](https://caniuse.com/xml-serializer) to parse HTML input strings. Currently, most browsers are supported except for Opera Mini.
# Development Setup
1. Clone the repository
```bash
git clone https://github.com/0xedward/dom-visualizer.git
```
2. Install development dependencies
```bash
cd dom-visualizer && npm install
```
3. Start server with live reload
```bash
npm start
```