使用按鈕來檢索XML

數據我曾在上單擊計算機科學按鈕，我從XML使用按鈕來檢索XML

<html> 
<head> 
<script src="loadxmldoc.js"></script> 
</script> 
</head> 
<body> 
<h1 style="text-align:center">DEPARTMENT DETAILS</h1> 
<button onclick="myfunction()">Computer Science</button> 
</br> 
<script> 
function myfunction(){ 
xmlDoc=loadXMLDoc("faculty.xml"); 
var x=xmlDoc.getElementsByTagName("computer")[0]; 
var y=x.childNodes; 
for(i=0;i<y.length;i++) 
document.write(y[i].nodeName+"&nbsp&nbsp"+y[i].childNodes[0].nodeValue+"</br>"); 
} 
</script> 
    </body> 
</html>

獲取數據的代碼當我點擊按鈕，我得到的數據，但一個新的頁面加載。我希望在按鈕下面有數據。如何做？

來源

2014-11-04 user3933528

document.write僅在DOM加載之前是陳舊和有用的。如果在此之後使用它，則會覆蓋當前的DOM，就像您發現的那樣。

改爲使用DOM方法並準備容器以接收內容。

HTML：

<div id='container'></div>

JS：

var cntr = document.querySelector('#container'), html = ''; 
for (var i = 0; i < y.length; i++) { 
    html += y[i].nodeName+"&nbsp&nbsp"+y[i].childNodes[0].nodeValue+"</br>"; 
} 
cntr.innerHTML = html;

來源

2014-11-04 12:14:42 Utkanos

完全同意document.write是古老的:-) – GibboK 2014-11-04 13:23:55

考慮使用這種方法。

基本上加載你的XML數據，並顯示結果在一個div「結果」;

<html> 
    <head> 
    <script src="loadxmldoc.js"></script> 
    </script> 
    </head> 
    <body> 
    <h1 style="text-align:center">DEPARTMENT DETAILS</h1> 
    <button onclick="myfunction()">Computer Science</button> 
    </br> 
    <script> 
    function myfunction(){ 
    xmlDoc=loadXMLDoc("faculty.xml"); 
    var x=xmlDoc.getElementsByTagName("computer")[0]; 
    var y=x.childNodes; 
    var result = document.getElementById('result'); 
    for(i=0;i<y.length;i++) 
    result.innerHTML = ''; // always reset 
    result.innerHTML +='y[i].nodeName+"&nbsp&nbsp"+y[i].childNodes[0].nodeValue+"</br>"'; 
    //document.write(y[i].nodeName+"&nbsp&nbsp"+y[i].childNodes[0].nodeValue+"</br>"); 
    } 
    </script> 
    <div id="result"></div> 
     </body> 
    </html>

來源

2014-11-04 13:29:23 GibboK

使用按鈕來檢索XML

回答

相關問題