javascript - 单击 3 次时替换元素不起作用

Question

我编写了简短的 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();
  }
};

Answer 1

将 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 时，每次 count 都会重置为其默认值 0

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