jquery parse xml – How to parse XML using jQuery?

jquery parse xml Method in jQuery is used to parse a string into an XML document. It uses native methods of the browser for creating a valid XML document.

jquery parse xml

Parsing a Text String. jQuery- Parse JSON, XML and HTML. jQuery itself can be used to parse an XML document on the client side.

var xml = $.parseXML(product.xml),
  $xml = $( xml ),
  $test = $xml.find('test');

console.log($test.text());

How to Parse Xml Using Jquery Example?

Read and Process XML using jQuery Ajax

//Code Starts
<?xml version="1.0" encoding="utf-8" ?>
<ProductList>
  <Product>
     <Title>Tamilrockers</Title>
     <Description>Tamil Rockers is a torrent website which facilitates the illegal distribution of copyrighted material, including television shows, movies, music and videos.</Description>
  </Product>
  <Product>
     <Title>hdhub4u</Title>
     <Description>HDHub4u.com | HDHub Movies | HDHub4u-300MB Movies, 480p Movies ~ HDHub4u.shop, HDHub.com, HDHub4u, MoviesKiDuniya, 720p Movies, 1080p movies, Dual Audio</Description>
  </Product>
  <Product>
     <Title>Tamilmv</Title>
     <Description>TamilMV.in is a free movie downloading website where you can watch or download various types of movies online in different languages. </Description>
  </Product>
  <Product>
     <Title>tamilblasters</Title>
     <Description>TamilBlasters.com Latest Movies Download. TamilBlasters New Tamil Dubbed Movies Multi Audios Telugu Kannada Malayalam Hindi Download tamilblasters.</Description>
  </Product>
</ProductList>
//Code Ends

jquery Code

//Code Starts
$(document).ready(function(){
  $("#dvContent").append("<ul></ul>");
  $.ajax({
    type: "GET",
    url: "ProductList.xml",
    dataType: "xml",
    success: function(xml){
    $(xml).find('Product').each(function(){
      var sTitle = $(this).find('Title').text();
      var sDescription = $(this).find('Description').text();
      $("<li></li>").html(sTitle + ", " + sDescription).appendTo("#dvContent ul");
    });
  },
  error: function() {
    alert("An error occurred while processing XML file.");
  }
  });
});
//Code Ends

jQuery parseXML() method

index.html

<!DOCTYPE html>  
<html>  
<head>  
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"> </script>   
</head>  
<body>  
<h3> It is an example of using the jQuery parseXML() method </h3>  
<p> Click the below button to alert the member details. </p>  
<button> Click Me </button>  
  
<script>  
$(document).ready(function(){  
 $("button").click(function(){  
  var str = "<xml version = '2.0'> <member> <name> Mayur </name> <mcode> E-102 </mcode> <salary> 18,500 </salary> </member> </xml>",  
  xmlDoc = $.parseXML(str),  
   $xml = $( str );  
  alert(" Name - " + $($xml).find("name").text() + "\n member-Id - " + $($xml).find("mcode").text() + " \n Salary - " + $($xml).find("salary").text() );   
 });  
});  
</script>  
</body>  
</html> 

Don’t Miss : Php Parse XML File SimpleXML

Also Read This πŸ‘‰   Laravel Renaming Uploaded Files Automatically

I hope you get an idea about jquery parse xml.
I would like to have feedback on my infinityknow.com.
Your valuable feedback, question, or comments about this Article are always welcome.
If you enjoyed and liked this post, don’t forget to share.