How to create XML Dynamically using JavaScript? Last Updated : 24 Apr, 2024 Comments Improve Suggest changes Like Article Like Report XML stands for Extensible Markup Language. It is a popular format for storing and exchanging data on the web. It provides a structured way to represent data that is both human-readable and machine-readable. There are various approaches to create XML Dynamically using JavaScript: Table of Content Using DOM ManipulationUsing Template LiteralsUsing DOM ManipulationIn this approach, We are going to use Document Object Model (DOM) to dynamically create XML elements. This approach allows you to programmatically construct XML structures by creating elements, setting attributes, and appending them to parent nodes. Example: This example demonstrate the using of DOM Manipulation Approach. HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Dynamic XML Creation using DOM Manipulation</title> </head> <body> <h2 style="color: green;"> GeeksForGeeks | Dynamic XML Creation using DOM Manipulation </h2> <p id="xmlOutput"></p> <script> // Create XML document let xmlDoc = document .implementation .createDocument(null, "root"); // Create elements let element1 = xmlDoc .createElement("employee"); let element2 = xmlDoc .createElement("name"); let element3 = xmlDoc .createElement("age"); // Create text nodes let textNode1 = xmlDoc .createTextNode("abc xyz"); let textNode2 = xmlDoc .createTextNode("21"); element2 .appendChild(textNode1); element3 .appendChild(textNode2); // Append elements to root element element1 .appendChild(element2); element1 .appendChild(element3); xmlDoc .documentElement .appendChild(element1); let xmlString = new XMLSerializer() .serializeToString(xmlDoc); // Display XML string console.log(xmlString); document .getElementById("xmlOutput") .innerText = xmlString; </script> </body> </html> Output: Using Template LiteralsIn this approach, we are going to use Template Literals it involves defining XML structures using JavaScript template literals. Template literals provide a convenient way to create multi-line strings with embedded expressions. Example: This example demonstrate the using of Template Literals Approach. HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Dynamic XML Creation using Template Literals</title> </head> <body> <h2 style="color: green;"> GeeksForGeeks | Dynamic XML Creation using Template Literals </h2> <p id="xmlOutput"></p> <script> let name = 'abc xyz' let age = 21 // Define XML structure // using template literals let xmlString = ` <root> <employee> <name>${name}</name> <age>${age}</age> </employee> </root>`; // Display XML string console.log(xmlString); document .getElementById("xmlOutput") .innerText = xmlString; </script> </body> </html> Output: Comment More infoAdvertise with us Next Article How to create XML Dynamically using JavaScript? jaimin78 Follow Improve Article Tags : JavaScript Web Technologies Web technologies-HTML and XML Similar Reads How to Create a Form Dynamically with the JavaScript? The task is to create an HTML form dynamically with the help of JavaScript. There are two approaches that are discussed below.Approach 1: Use document.createElement() to create the new elements and use setAttribute() method to set the attributes of elements. Append these elements to the <form> 3 min read How to add HTML elements dynamically using JavaScript ? We learn how to add HTML elements dynamically using JavaScript. A basic understanding of HTML, CSS, and JavaScript is required. Here we are going to use a button and by clicking this button, we can add an HTML element dynamically in this example. Below are the approaches used to add HTML elements dy 2 min read How to Create XML in JavaScript ? In JavaScript, XML documents can be created using various approaches. You can define elements, attributes, and content to structure the XML data, and then serialize it into a string for use or storage. There are several approaches to creating XML in JavaScript which are as follows: Table of Content 2 min read How to dynamically create new elements in JavaScript ? New elements can be dynamically created in JavaScript with the help of createElement() method. The attributes of the created element can be set using the setAttribute() method. The examples given below would demonstrate this approach. Example 1: In this example, a newly created element is added as a 4 min read How to Access XML Data via JavaScript ? XML stands for Extensible Markup Language. It is a popular format for storing and exchanging data on the web. It provides a structured way to represent data that is both human-readable and machine-readable. There are various approaches to accessing XML data using JavaScript which are as follows: Tab 2 min read How to Create Dynamic Values and Objects in JavaScript? In JavaScript, you can choose dynamic values or variable names and object names and choose to edit the variable name in the future without accessing the array, Dynamic values and objects in JavaScript allow changing, accessing, or creating values and object properties at runtime for flexibility and 3 min read How to Create an Image Element using JavaScript? Creating an image element dynamically using JavaScript is a useful technique when you want to add images to a webpage without having to manually write the <img> tag in your HTML. This allows for more flexibility, as we can create and manipulate images based on user interactions or other condit 2 min read How to Create a Style Tag using JavaScript? To create a <style> tag using JavaScript, use the document.createElement() method to create the tag, which allows you to dynamically add elements to the DOM.Syntaxdocument.createElement('style')Example 1: This HTML code dynamically styles a <div> element with a green background and white 1 min read How to Create JSON String in JavaScript? JSON strings are widely used for data interchange between a server and a client, or between different parts of a software system. So converting objects to JSON strings is very important for good client-server communication. Below are the following approaches to creating a JSON string: Table of Conte 2 min read How to generate an XML file dynamically using PHP? A file can be generated using PHP from the database, and it can be done by the static or dynamic method in PHP. Static methods can be called directly - without creating an instance of a class. Here we are going to discuss how to create an XML file dynamically.The first thing we need to do is fetch t 2 min read Like