基于JS判断iframe是否加载成功的方法(多种浏览器）

判断iframe是否加载成功一般可以通过以下几种方法：

1. 使用iframe的onload事件

在iframe页面加载完成后触发onload事件，可以使用此事件判断页面是否加载完成。

示例代码如下：

<iframe id="test_iframe" src="test.html" onload="onIframeLoad()"></iframe>

<script>
function onIframeLoad() {
  var iframe = document.getElementById("test_iframe");
  console.log("iframe页面加载完成", iframe.contentDocument); // 在控制台输出iframe页面文档内容
}
</script>

2. 使用setInterval轮询iframe的内容

如果iframe的onload事件无法被触发，可以考虑使用setInterval轮询iframe的内容，判断是否加载完成。

示例代码如下：

<iframe id="test_iframe" src="test.html"></iframe>

<script>
var intervalId = setInterval(function() {
  var iframe = document.getElementById("test_iframe");
  try {
    var contentDocument = iframe.contentDocument;
    clearInterval(intervalId); // 如果可以获取到contentDocument，说明iframe加载完成，可以停止轮询
    console.log("iframe页面加载完成", contentDocument); // 在控制台输出iframe页面文档内容
  } catch(e) {
    console.log("iframe页面未加载完成"); // 如果无法获取contentDocument，说明iframe页面未加载完成
  }
}, 1000); // 每隔1秒轮询一次
</script>

3. 在iframe页面中使用window.parent通信

如果iframe和父页面在同一域名下，可以在iframe页面中使用window.parent通信，向父页面发送消息，通知父页面iframe已经加载完成。

示例代码如下：

<!-- 父页面 -->
<iframe id="test_iframe" src="test.html"></iframe>

<script>
window.addEventListener("message", function(event) {
  if (event.data === "iframeLoaded") {
    console.log("iframe页面加载完成"); // 在控制台输出结果
  }
});

// 在iframe加载完成后向父页面发送消息
var iframe = document.getElementById("test_iframe");
iframe.addEventListener("load", function() {
  window.parent.postMessage("iframeLoaded", "*");
});
</script>

<!-- iframe页面 -->
<script>
// 在iframe加载完成后向父页面发送消息
window.addEventListener("load", function() {
  window.parent.postMessage("iframeLoaded", "*");
});
</script>