javascript - Using button to retrieve data from XML -

I have created a code in which I get data from XML when I click the Computer Science button

  & lt; Html & gt; & Lt; Top & gt; & Lt; Script src = "loadxmldoc.js" & gt; & Lt; / Script & gt; & Lt; / Script & gt; & Lt; / Head & gt; & Lt; Body & gt; & Lt; H1 style = "text-align: center" & gt; Department Details & lt; / H1> & Lt; Button onclick = "myfunction ()" & gt; Computer Science & lt; / Button & gt; & Lt; / Br & gt; & Lt; Script & gt; Function myfunction () {xmlDoc = loadXMLDoc ("faculty.xml"); Var x = xmlDoc.getElementsByTagName ("computer") [0]; Var y = x.childNodes; (I = 0; i & lt; y.length; i ++) document. Written (y [i] .nodeName + "& amp; nbsp; & amp; nbsp; + y [i]. ChildNode [0]. NodeValue + "& lt; / b & gt;")}}     

When I click on the button, I get the data but a new page is loaded. I have to keep the data under the buttons like this?

document.write is only archived and useful DOM has been loaded. If it is used after that, then it can be found by you Overwrites DOM.

Use DOM methods instead, and create a container to get the content.

HTML:

  & Lt; div id = 'container' & gt; & lt; / div & gt;  

js:

  var cntr = document.query selector ('# Container'), html = ''; (Var i = 0; i & lt; y.length; i ++) {html + = y [i] .nodeName + "& amp; Amp; Nbsp; + Y [i]. ChildNode [0] .nodeValue + "& lt; / br & gt ;,"; } Cntr.innerHTML = html;