Skip to content
domFormat is a simple javascript library to get DOM nodes as formatted/pretty strings.
Branch: gh-pages
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
bookmarklet
build
examples
src
.gitignore
README.md
domFormat.js
domFormat.min.js
index.html

README.md

domFormat

Description

domFormat is a simple javascript library to get DOM nodes as formatted/pretty strings. It provides a simple API with 2 functions:

domFormat.init(settings);
domFormat.getString(node);

I created it as a way to help compare the generated source of 2 pages when doing development. Before creating this library, I had searched for another library to do something similar, but everything I evaluated gave results that were formatted slightly different than they way I wanted.

This code is designed to run in the browser, and uses the browser's native DOM parsing to create a "prettified" string.

Links

Source Code / Download
Examples
Bookmarklet

Libraries Used / Included

CSS Beautify

  • Originally written by Ariya Hidayat

  • Copyright (C) 2011 Sencha Inc.

JS Beautifier

  • Originally written by Einar Lielmanis

Browser Support

Most modern browsers are supported with the caveat that IE support/output is somewhat strange.

IE Quirks/Bugs:

  • Tag names will be in all uppercase because IE doesn't support node.prefix and node.localName when parsing DOM nodes

  • For the same reason above, namespaces will not be printed correctly: <svg:svg /> will turn into <SVG />

  • <style /> and <script /> tags lose their contents

  • Doctype nodes are treated as a comment (standards vs quirks mode)

Version History

v1.4 - Released April 25, 2014

  • Changing links from skratchdot.github.io -> projects.skratchdot.com

v1.3 - Released October 5, 2013

  • Changing links from skratchdot.github.com -> skratchdot.github.io

v1.2 - Released November 17, 2012

v1.1 - Released November 6, 2012

  • Fixing IE bug when rendering Node.DOCUMENT_TYPE_NODE

  • Reformatting source code.

v1.0 - Released July 25, 2011

  • Initial Release

  • Known Bugs:

    1. IE Quirks/Bugs listed in the Browser Support section above
    2. Unsupported node types:
    • Node.ENTITY_REFERENCE_NODE === 5
    • Node.ENTITY_NODE === 6
    • Node.PROCESSING_INSTRUCTION_NODE === 7
    • Node.NOTATION_NODE === 12
You can’t perform that action at this time.