Question

昨天，我也问了同样的问题，但今天我会尝试用一些工作实例来更具体一点。

我想通过addEventListener添加一些代码。我会使用DOMContentLoaded，但我正在尝试选择的ID在页面加载时不可用。它是由AJAX GET方法完成的。我可以使用mouseover，但它会在任何移动中迭代代码。我也可以使用click事件，但我不希望它在点击时显示，但只是在显示时。我怎么处理呢？

我无法在这里轻松地将它附加到您，因为文件的域名将是另一个，但我添加的代码部分是：

document.addEventListener("click", function(event){
  document.querySelector("h1").insertAdjacentHTML('afterend', '<div>asd</div>');
});

这适用于click或mousover这些事件，但我希望它只是在加载时。

您可以在此处测试整个代码：https://www.w3schools.com/js/tryit.asp?filename=tryjs_ajax_first 使用我添加的代码，它看起来像这样：

<!DOCTYPE html>
<html>
<body>

<div id="demo">
<h2>The XMLHttpRequest Object</h2>
<button type="button" onclick="loadDoc()">Change Content</button>
</div>

<script>
function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
      document.getElementById("demo").innerHTML =
      this.responseText;
    }
  };
  xhttp.open("GET", "https://www.w3schools.com/js/ajax_info.txt", true);
  xhttp.send();
}
document.addEventListener("click", function(event){
  document.querySelector("h1").insertAdjacentHTML('afterend', '<div>asd</div>');
});
</script>

</body>
</html>

在AJAX采用的ID上通过addEventListener添加代码

0 个答案: