Languages
[Edit]
EN

JavaScript - parse XML in web browser

3 points
Created by:
Niac
478

In this article, we would like to show you how to parse XML using web browser JavaScript.

Practical examples

Example 1

// ONLINE-RUNNER:browser;

const parseXml = (xml) => {
    const parser = new DOMParser();
    return parser.parseFromString(xml, 'text/xml');
};


// Usage example:

const xml = `
  <user>
    <id>1</id>
    <name>John</name>
  </user>
`;

const instance = parseXml(xml);

const userElement = instance.children[0];
const idElement = userElement.children[0];
const nameElement = userElement.children[1];

console.log(idElement.textContent);    // 1
console.log(nameElement.textContent);  // John

Example 2

// ONLINE-RUNNER:browser;

const parseXml = (xml) => {
    const container = document.createElement('template');
    container.innerHTML = xml;
    return container.content;
};


// Usage example:

const xml = `
  <user>
    <id>1</id>
    <name>John</name>
  </user>
`;

const instance = parseXml(xml);

const userElement = instance.children[0];
const idElement = userElement.children[0];
const nameElement = userElement.children[1];

console.log(idElement.textContent);    // 1
console.log(nameElement.textContent);  // John

 

See also

  1. JavaScript - parse XML data to POJO (to object)

  2. JavaScript - parse HTML in web browser

  3. Node.js - parse html to DOM with htmlparser2 library

References

  1. DOMParser - Web APIs | MDN
  2. DOMParser.parseFromString() - Web APIs | MDN

Alternative titles

  1. JavaScript - how to parse XML in web browser?
Donate to Dirask
Our content is created by volunteers - like Wikipedia. If you think, the things we do are good, donate us. Thanks!
Join to our subscribers to be up to date with content, news and offers.
Native Advertising
🚀
Get your tech brand or product in front of software developers.
For more information Contact us
Dirask - we help you to
solve coding problems.
Ask question.

❤️💻 🙂

Join