Javascript 和 XML 按钮

Question

您好，我已经通过 html 创建了一个按钮，我正试图在单击该按钮时显示一个 XML 页面。我需要通过 javascript 执行此操作，但它似乎对我不起作用。

我的 HTML:

<input type="button" value="Shop 1" id ="one">
<input type="button" value="Shop 2" id ="two">
<input type="button" value="Put Selected Pictures in Cart" id ="three">

我的 JavaScript:

 function getData(filename) { env = new XMLHttpRequest(); env.open("GET",            filename); } 

 function init()
{

 document.getElementById('one').onclick = function(){ getData('shop1.xml'); }
 document.getElementById('two').onclick = function(){ getData('shop2.xml'); }
}

如有任何帮助，我们将不胜感激。谢谢。

Answer 1

由于 XMLHttprequests 的本质是异步的，您应该在回调函数中处理检索到的数据(或者您可以通过指定 env.open("GET",url, true) 使其同步)。您的新 getData 函数将如下所示:

function getData(url, callback) { 
  var env = new XMLHttpRequest(); 
  env.onload = function() {
    callback(env.response);
  };
  env.open("GET", url); 
}

您可以按如下方式使用它:

var one = document.getElementById('one'),
    two = document.getElementById('two');

one.onclick = function(){
  getData('shop1.xml', function(response) { 
     /* do whatever you want with the response XML */ 
  });
}
two.onclick = function(){
  getData('shop2.xml', function(response) { 
     /* do whatever you want with the response XML */ 
  });
}

参见 MDN: Using XMLHttpRequest获取更多信息。请注意，这只会将 XMLdoc 作为字符串获取；如果您需要将其作为 XML 树遍历，则需要使用 DOMParser API .