Example2-XSLT-jQuery.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta encoding="utf-8">
<title>XSLT</title>
<script src="jquery-3.6.0.min.js"></script>
</head>
<body>

<div id="example"></div>

<script type="text/javascript">

$(function(){

if (!('XSLTProcessor' in window)) {
	  console.log('XSLTProcessor does not appear to be available in this browser. Please try another.');
	  return;
}else{
	console.log('XSLTProcessor available.');
}


const xsltProcessor = new XSLTProcessor();

//XSLT file

$.ajax({
    type: "GET",
    url: "data/example.xsl",
    dataType: "xml",
    success: function (xsl) {
	    xsltProcessor.importStylesheet(xsl);
    }
});

//XML file

$.ajax({
    type: "GET",
    url: "data/example.xml",
    dataType: "xml",
    success: function (xml) {
	 const fragment = xsltProcessor.transformToFragment(xml, document);
	 $("#example").append(fragment);
    }

});

});

</script>
</body>
</html>