javascript - 当此 setTimeout() 调用父级中的另一个 setTimeout() 时，如何在 iframe 中运行带有 setTimeout() 回调的函数？

Question

我的页面上有一个动态创建的 iframe。像这样:

var iframe = document.createElement('iframe');
iframe.setAttribute("id","myIframe");
iframe.src = "iframePage.html";
document.body.appendChild(iframe);

在“iframePage.html”中，我有在 mainPage.html 上运行的相同 scriptfile.js。因此，我可以调用一个或另一个页面内的所有函数。

在这个 scriptfile.js 中，我有一个由“iframePage.html”上的按钮调用的函数。该函数在 1 秒内从 DOM 中删除 iframe!就像这样:

function closeAndRemoveIframe() {
   setTimeout(function() {
      var myIframe = window.parent.document.getElementById("myIframe");
      myIframe.parentNode.removeChild(myIframe);
   },1000);
}

好的。但是我在这个函数中添加了对另一个函数的调用。但是这个函数包含一个 setTimeout，它会产生 3 秒的延迟。

就像这样:

function closeAndRemoveIframe() {
   setTimeout(function() {
      var myIframe = window.parent.document.getElementById("myIframe");
      myIframe.parentNode.removeChild(myIframe);
      myNewFunction();
   },1000);
}

问题是:这个新函数具有更长的运行时间 setTimeout(3000 毫秒)。

function myNewFunction() {
   setTimeout(function() {
      console.log("Hello world");
   },3000);
}

iframe 是调用“myNewFunction()”函数的框架。一旦它在 1 秒后从 DOM 中删除，新功能就不会发生，因为它有 3 秒的延迟!

我找到的唯一解决方案是在第一个函数的 setTimeout 中放入相同的时间!但这不是理想的行为!

那么，有没有什么办法可以解决这个问题而不必增加第一个函数的settimeout时间呢？

P.s:我使用的是 vanilla JS。

非常感谢!

Answer 1

您是否尝试过在 removeChild 函数调用之前移动 myNewFunction 调用？