toXML - Pure JavaScript XML Writer

Yusuke Kawasaki

Last update: Apr 1, 2022

Related tags

Learning resource to-xml

Overview

toXML - Pure JavaScript XML Writer

Live Demo: https://kawanet.github.io/from-xml/

FEATURES

Simple: single writer function toXML() which returns XML string.
Small: 2KB minified, 1KB gzipped.
Standalone: no external module dependency nor DOM needed.
TypeScript definition: to-xml.d.ts

SYNOPSIS

Node.js:

const toXML = require("to-xml").toXML;

Browser:

<script src="https://cdn.jsdelivr.net/npm/to-xml/dist/to-xml.min.js"></script>

Run:

const data = {
  "xml": {
    "@foo": "FOO",
    "bar": {
      "baz": "BAZ"
    }
  }
};

const xml = toXML(data, null, 2);

console.warn(xml);

Result:

<xml foo="FOO">
  <bar>
    <baz>BAZ</baz>
  </bar>
</xml>

EXAMPLES

Empty Element

JavaScript: null

{
  "xml": {
    "foo": {"@bar": "BAR"},
    "buz": null,
    "qux": {},
    "quux": ""
  }
}

XML: empty element

<xml>
  <foo bar="BAR"/>
  <buz/>
  <qux></qux>
  <quux></quux>
</xml>

Empty Attribute

JavaScript: @ property name or null value

{
  "xml": {
    "@": "bar",
    "@baz": null,
    "foo": "FOO"
  }
}

XML: empty attribute

<xml bar baz>
    <foo>FOO</foo>
</xml>

Multiple Child Nodes

JavaScript: Array of String or Array of Object

{
  "xml": {
    "foo": ["BAR", "BAZ", "QUX"]
  }
}

XML: child nodes

<xml>
  <foo>BAR</foo>
  <foo>BAZ</foo>
  <foo>QUX</foo>
</xml>

Text Node with Attribute

JavaScript: # property name

{
  "xml": {
    "foo": {
      "@bar": "BAR",
      "#": "BAZ"
    }
  }
}

XML: text node

<xml>
  <foo bar="BAR">BAZ</foo>
</xml>

XML Declaration and Comment

JavaScript: ? and ! property name

{
  "?": "xml version=\"1.0\"",
  "!": "DOCTYPE note SYSTEM \"Note.dtd\"",
  "note": {
    "title": "FOO",
    "!": "-- comment --",
    "body": "BAR"
  }
}

XML:

<?xml version="1.0"?>
<!DOCTYPE note SYSTEM "Note.dtd">
<note>
  <title>FOO</title>
  <!-- comment -->
  <body>BAR</body>
</note>

Fragment

JavaScript: # property name

{
  "plist": {
    "@version": "1.0",
    "dict": {
      "#": [
        {"key": "CFBundleDevelopmentRegion"},
        {"string": "ja"},
        {"key": "CFBundleIcons"},
        {"dict": null},
        {"key": "LSRequiresIPhoneOS"},
        {"true": null}
      ]
    }
  }
}

XML: child node list in order

<plist version="1.0">
  <dict>
    <key>CFBundleDevelopmentRegion</key>
    <string>ja</string>
    <key>CFBundleIcons</key>
    <dict/>
    <key>LSRequiresIPhoneOS</key>
    <true/>
  </dict>
</plist>

CLI

$ echo '{"foo":{"@bar":"BAR","buz":"BUZ"}}' | ./node_modules/.bin/json2xml -2
<foo bar="BAR">
  <buz>BUZ</buz>
</foo>

LICENSE

The MIT License (MIT)

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Runtime type checking in pure javascript.

Install npm install function-schema Usage import { signature } from 'function-schema'; const myFunction = signature(...ParamTypeChecks)(ReturnValueCh

May 30, 2022

Tempo is an easy, intuitive JavaScript rendering engine that enables you to craft data templates in pure HTML.

Tempo 2.0 Tempo is an easy, intuitive JavaScript rendering engine that enables you to craft data templates in pure HTML. Why use Tempo? Clear separati

Jan 3, 2023

Adds `long-press` event to the DOM in 1k of pure JavaScript

long-press-event A 1k script that adds a long-press event to the DOM using CustomEvent and pure JavaScript. Works in IE9+, Chrome, Firefox, Safari as

Jan 2, 2023

ScrollSpy in pure JavaScript

VanillaJS ScrollSpy ScrollSpy in pure JavaScript. Browser Support IE 10+ ✔ Latest ✔ Latest ✔ Latest ✔ Latest ✔ Installation $ npm install vanillajs-sc

Dec 13, 2022

Responsive tabs-to-accordion script without jQuery, written using pure JavaScript

vanilla-tabs Responsive tabs-to-accordion script without jQuery, written using pure JavaScript Author Dmytro Kudleichuk LinkedIn GitHub Online Demo Se

Dec 20, 2022

A pure JavaScript QRCode encode and decode library.

QRCode A pure JavaScript QRCode encode and decode library. QRCode guide and demo QRCode guide QRCode example QRCode example use worker Modify from kaz

Nov 28, 2022

A graphical web-based audio visualizer which reads music data using Pure JavaScript, and draws a graphical view in Canvas.

Audio Visualizer JS A graphical web-based audio visualizer which reads music data using Pure JavaScript, and draws a graphical view in Canvas. Demo: h

Aug 9, 2022

A Pure JavaScript Solution to create Tags Input Element.

JavaScript Tags Input Library Native JavaScript library to make Tags Input Element in DOM. There isn't any dependency for this library, add it straigh

Jun 27, 2022

Pure JavaScript (VanillaJS) dropdown menu, with multiple select and searching support

JS Select Pure JavaScript (VanillaJS) dropdown menu, with multiple select and searching support How to use To use the select plugins, two main file mu

Mar 17, 2022

Comments

Compact element with attrs but with null content
At the moment, the following JSON object:

{ 'name': { '@attr': 'value', '#': null } }

is converted to following XML fragment:

<name attr="value"></name>

Instead, it should be:

<name attr="value" />
opened by zuck 6