Question

我正在努力在我的网站上设置动态页面，点击＆＃34;更多信息＆＃34;按钮触发loadBCW.js脚本，该脚本使用保存在其他位置的文本文件更新<div>的innerHTML。我使用此loadBCW.js：

完美地完成了这项工作

document.getElementById("loadBCW").addEventListener('click',function(){
var url = "/wp-content/themes/DICE/js/descriptionBCW";
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
  if (this.readyState == 4 && this.status == 200) {
  document.getElementById("demo").innerHTML =
  this.responseText;
  }
};
xhttp.open("GET", url, true);
xhttp.send();
document.getElementById("demo").innerHTML = url;
}, false);

我的问题是，当我点击其中一个＆＃34;更多信息＆＃34;按钮为了更改<div> innerHTML，它会在url中闪烁变量<div>，然后正确的元素会覆盖它。

如何在实际更新url之前指示js不要在屏幕上闪烁变量<div>？

Answer 1

也许摆脱将div内容设置为URL的代码？我已经注释掉了你应删除的内容：

document.getElementById("loadBCW").addEventListener('click',function(){
    var url = "/wp-content/themes/DICE/js/descriptionBCW";
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 && this.status == 200) {
            document.getElementById("demo").innerHTML =
            this.responseText;
        }
    };
    xhttp.open("GET", url, true);
    xhttp.send();
    // document.getElementById("demo").innerHTML = url;
}, false);

您正在向外部源发出异步请求，因此xhttp.onreadystatechange内的代码不会运行，直到成功检索到该文件。除了优化您的网站以更快地运行之外，您无法做任何其他事情。因此，如果您不希望网址可见，那么首先设置它就没有意义。

然而，如果它是同步请求会更糟糕，因为它不仅会降低您的性能，而且由于document.getElementById("demo").innerHTML = url; 在您的功能之后，因此保证结束用URL替换内容。

如何使用外部Javascript更新HTML与外部文本文档时隐藏路径位置

1 个答案: