javascript - 单击3次后无法替换元素

我编写了简短的JavaScript代码，以在单击3次后替换一个元素。超过3次点击后，元素将自己替换为url。但是问题在于它无法正常工作。 3次单击后，我试图使其替换为自己，但可能将其编码错误。请赐教。

原始代码：

function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
     document.getElementById("replace1").innerHTML = this.responseText;
    }
  };
  xhttp.open("GET", "https://natevanghacks.com/replacements/yoinkexecutor2.html"), true;
  xhttp.send();
}

重新编码为仅可点击3次，但无效：

function loadDoc() {
  var xhttp = new XMLHttpRequest();
  let count = 0;
  let callback = function() {
    count++;
    if (count >= 3) {
      document.getElementById("replace1").innerHTML = this.responseText;
    }
    iframe1.click(callback);
    xhttp.open("GET", "https://natevanghacks.com/replacements/yoinkexecutor2.html"), true;
    xhttp.send();
  }
};

最佳答案

将count设置为全局变量意味着超出函数范围：

let count = 0;
function loadDoc() {
  var xhttp = new XMLHttpRequest();

  let callback = function() {
    count++;
    if (count >= 3) {
      document.getElementById("replace1").innerHTML = this.responseText;
    }
    iframe1.click(callback);
    xhttp.open("GET", "https://natevanghacks.com/replacements/yoinkexecutor2.html"), true;
    xhttp.send();
  }
};

当您在函数内定义count时，则每次计数均重置为其默认值0

这就是为什么您需要在函数外部定义count的原因。