XML to JSON Conversion: Patterns, Pitfalls and Best Practices

Why Convert XML to JSON?

XML dominated web services for decades (SOAP, WSDL, RSS, Atom). JSON has largely replaced it in modern APIs, but vast amounts of enterprise infrastructure still emit XML. Converting XML to JSON is essential for:

• Consuming legacy SOAP APIs in a modern JavaScript application
• Processing RSS and Atom feeds
• Migrating from XML-based config to JSON-based config
• Integrating with enterprise systems (SAP, Salesforce SOAP, banking APIs)

Basic Conversion Pattern

Each XML element becomes a JSON key. The element's text content becomes the value:

<user>
  <name>Ravi Kumar</name>
  <age>28</age>
  <active>true</active>
</user>

{
  "user": {
    "name": "Ravi Kumar",
    "age": 28,
    "active": true
  }
}

The root element (user) becomes the top-level JSON key.

Repeated Elements Become Arrays

When sibling elements share the same tag name, they are merged into a JSON array:

<catalog>
  <item>Widget A</item>
  <item>Widget B</item>
  <item>Widget C</item>
</catalog>

{
  "catalog": {
    "item": ["Widget A", "Widget B", "Widget C"]
  }
}

This is the standard convention for representing XML lists in JSON.

Nested Elements

<order>
  <id>1001</id>
  <customer>
    <name>Priya</name>
    <city>Ahmedabad</city>
  </customer>
  <total>349.00</total>
</order>

{
  "order": {
    "id": 1001,
    "customer": {
      "name": "Priya",
      "city": "Ahmedabad"
    },
    "total": 349
  }
}

XML Attributes — The Tricky Part

XML attributes have no direct JSON equivalent:

<product id="101" category="electronics">
  <name>Laptop</name>
</product>

Common conventions for handling attributes in JSON: - Ignore them (simplest — works if attributes are metadata) - Prefix with @: { "@id": "101", "@category": "electronics", "name": "Laptop" } - Flatten: merge attributes and child elements as sibling keys

JSONKit's converter currently ignores attributes and focuses on element content. Use a library like fast-xml-parser for full attribute support.

RSS Feed Example

<rss version="2.0">
  <channel>
    <title>Tech News</title>
    <item>
      <title>Article 1</title>
      <link>https://example.com/1</link>
    </item>
    <item>
      <title>Article 2</title>
      <link>https://example.com/2</link>
    </item>
  </channel>
</rss>

The two item elements become a JSON array — making it easy to iterate in JavaScript.

JavaScript: Using DOMParser

In the browser, you can parse XML without a library:

const parser = new DOMParser();
const doc = parser.parseFromString(xmlString, 'text/xml');
const root = doc.documentElement;

For Node.js, use the fast-xml-parser npm package or the built-in xml2js.

Common Pitfalls

CDATA sections: <![CDATA[...]]> content is treated as text. Most converters handle this correctly.

Namespaces: XML namespaces (xmlns:prefix) can complicate key names. Strip namespace prefixes or handle them explicitly.

Empty elements: <tag/> and <tag></tag> both produce null in JSON.

Mixed content: Elements containing both text and child elements (common in HTML-like XML) are complex to convert and may lose content.

Use JSONKit's XML to JSON tool for quick browser-based conversion — paste any XML and get structured JSON instantly.