Book details
book_details.xml
<books> <book> <title>TheGreatGatsby</title> <author>F.ScottFitzgerald</author> <year>1925</year> <price>10.99</price> </book> <book> <title>ToKillaMockingbird</title> <author>HarperLee</author> <year>1960</year> <price>8.99</price> </book> <book> <title>1984</title> <author>GeorgeOrwell</author> <year>1949</year> <price>6.99</price> </book> <book> <title>PrideandPrejudice</title> <author>JaneAusten</author> <year>1813</year> <price>7.99</price> </book> </books>Ajaxfile
<!DOCTYPEhtml> <html> <head> <title>BookDetails</title> <scriptsrc=https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js></script> <script> $(document).ready(function(){ $(“select”).change(function(){ Varbook=$(this).val(); $.ajax({ url:“book_details.xml”, dataType:“xml”, success:function(xml){ $(xml).find(‘book’).each(function(){ Vartitle=$(this).find(‘title’).text(); If(title==book){ Varauthor= $(this).find(‘author’).text(); Varyear=$(this).find(‘year’).text(); Varprice=$(this).find(‘price’).text(); $(“#details”).html(“Author:“+author +“<br>Year:“+year+“<br>Price:“+price); } }); } }); }); }); </script> </head> <body> <select> <option>Selectabook</option> <option>TheGreatGatsby</option> <option>ToKillaMockingbird</option> <option>1984</option> <option>PrideandPrejudice</option> </select> <divid=”details”></div> </body> </html>