Eliminate full stops from within the XML elements

Question

Eliminate full stops from within the XML elements

I encountered a strange issue where the XML files contain periods (.) within them.

<member>
    <name>ABCD</name>
        <value>         
             <date.of.birth>02.05.2000</date.of.birth>
        </value>                        
</member>

As a result, I am facing difficulty parsing the XML in javascript. I typically convert this XML into JSON and utilize JSON.parse().

If you have any insights on how to efficiently replace all periods in XML Tags with an underscore or another character using Javascript, please share your expertise. Here is an example of what I am looking for:

<member>
    <name>ABCD</name>
        <value>         
                <date_of_birth>02.05.2000</date_of_birth>
        </value>                        
</member>

Thank you in advance.

javascript xml json

Answer 1

Answer №1

To achieve parsing, one can utilize pure JavaScript:

var content = '<?xml version="1.0" encoding="UTF-8"?><member><name>ABCD</name><value><date.of.birth>02.05.2000</date.of.birth></value></member>';

if (window.DOMParser)
{
  var parser = new DOMParser();
  var xmlDoc = parser.parseFromString(content, "application/xml");
}
else // For Internet Explorer
{
  var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
  xmlDoc.async = false;
  xmlDoc.loadXML(content);
}

// Accessing DOM elements:
var element = xmlDoc.getElementsByTagName('date.of.birth')[0];

To replace a tag, the following code can be used:

var newElement = xmlDoc.createElement('date_of_birth');
newElement.innerHTML = element.innerHTML;
element.parentNode.insertBefore(newElement, element);
element.parentNode.removeChild(element);

// Displaying the updated XML document
xmlDoc

Update:

To dynamically find elements with a specific tag name, you can use the following approach:

 var allElements = xmlDoc.getElementsByTagName("*"); // Get all elements
 var filteredElements = [];
 for(var j=0; j < allElements.length; j++)
 { 
   if ( /\./.test(allElements[j].tagName) ) // Filter by our criteria
   { 
     filteredElements.push(allElements[j]);
   } 
 }
 filteredElements // Contains the expected elements

Answer 2

To achieve parsing, one can utilize pure JavaScript:

var content = '<?xml version="1.0" encoding="UTF-8"?><member><name>ABCD</name><value><date.of.birth>02.05.2000</date.of.birth></value></member>';

if (window.DOMParser)
{
  var parser = new DOMParser();
  var xmlDoc = parser.parseFromString(content, "application/xml");
}
else // For Internet Explorer
{
  var xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
  xmlDoc.async = false;
  xmlDoc.loadXML(content);
}

// Accessing DOM elements:
var element = xmlDoc.getElementsByTagName('date.of.birth')[0];

To replace a tag, the following code can be used:

var newElement = xmlDoc.createElement('date_of_birth');
newElement.innerHTML = element.innerHTML;
element.parentNode.insertBefore(newElement, element);
element.parentNode.removeChild(element);

// Displaying the updated XML document
xmlDoc

Update:

To dynamically find elements with a specific tag name, you can use the following approach:

 var allElements = xmlDoc.getElementsByTagName("*"); // Get all elements
 var filteredElements = [];
 for(var j=0; j < allElements.length; j++)
 { 
   if ( /\./.test(allElements[j].tagName) ) // Filter by our criteria
   { 
     filteredElements.push(allElements[j]);
   } 
 }
 filteredElements // Contains the expected elements

Answer 3

Answer №2

Using JavaScript

It may not be as straightforward to accomplish this task using vanilla JavaScript.

Update: Check out JavaScript: how to modify tag name?

Using XML

On the other hand, achieving this in XML is much simpler. All you have to do is match the dot-named tags with an xml:template and reassign it a custom name.

<xml:template match="date.of.birth">
  <xml:element name="replace(local-name(), '.', '_')">
    <xml:value-of select="./text()" />
  </xml:element>
</xml:template>

In this example, I am generating an xml:element based on the original name where I substitute any instances of a . (dot) with an underscore _.

Answer 4

Using JavaScript

It may not be as straightforward to accomplish this task using vanilla JavaScript.

Update: Check out JavaScript: how to modify tag name?

Using XML

On the other hand, achieving this in XML is much simpler. All you have to do is match the dot-named tags with an xml:template and reassign it a custom name.

<xml:template match="date.of.birth">
  <xml:element name="replace(local-name(), '.', '_')">
    <xml:value-of select="./text()" />
  </xml:element>
</xml:template>

In this example, I am generating an xml:element based on the original name where I substitute any instances of a . (dot) with an underscore _.

Eliminate full stops from within the XML elements

Answer №1

Answer №2

Using JavaScript

Using XML

Similar questions

Utilizing Matrix Distance Genetic Algorithm for Mobile Applications

Retrieve the innerHtml value of an asp.net Label using C# programmatically

What is the correct way to link to a SCSS file within a component's directory?

Guide to implementing event handling with JavaScript on an HTML form webpage

Unusual problem arises with styling and element measurement (scrollWidth / scrollWidth) in Gatsby framework

Having trouble implementing styles for an element selected using the document.getElementsByClassName() method

What is the best way to trigger the afterRender handler function within a nested foreach loop?

Error: The variable 'error' could not be located

Display all items with pagination in a Material UI Table using React

How to extract only the value from a MongoDB query using NodeJS

Obtaining XML data is possible using the "Postman software," however, accessing data through SWIFT is proving to be a challenge

Establishing the maximum width of a Vuetify expansion panel component

Validating Credit Card Numbers with Spaces

HTML5 enables users to pick their preferred font style

How can I construct a Query Builder expression in Laravel that involves selecting from 2 different tables?

Display different data in an HTML table for each individual click on the "Read more" event

How to assign an enum value to a JSON object in an Angular application

Strategies for structuring CoreData to manage intricate datasets

Embedding a stylesheet into an HTML document can be done automatically

Differences between functions in Angular services and components: which one to use?