iframe 动态加载并设置立即加载

iframe (内嵌框架) 动态加载并设置立即加载通常用于创建跨域网页的嵌套内容或者当需要异步加载大块数据以提高页面性能。下面是实现这个功能的基本步骤：

1. **HTML结构**:

<div id="dynamicIframeContainer"></div>

这里的`<div>`标签将用于后续JavaScript动态插入iframe元素。

2. **JavaScript处理**:

document.getElementById('dynamicIframeContainer').innerHTML = `
  <iframe src="初始URL" frameborder="0" width="100%" height="500" onload="loadFunction()" allowfullscreen></iframe>
`;

function loadFunction() {
  // 这里可以添加更多的初始化操作，如检查是否成功加载等
  if (iframe.contentWindow && iframe.contentDocument) {
    // 如果iframe已经加载完成，执行后续操作
    iframe.onload = null; // 取消默认的onload事件，防止多次触发
    // 设置你想立即执行的动作，例如显示加载完成提示、开始数据交互等
    immediatelyLoadContent();
  }
}

function immediatelyLoadContent() {
  // 插入到iframe的内容区域
  var iframeDoc = iframe.contentDocument || iframe.contentWindow.document;
  iframeDoc.body.innerHTML = '内容已加载';
}

在这个例子中，`loadFunction`会在iframe加载完成后被调用。如果立刻需要加载内容，可以在`immediatelyLoadContent`函数中执行。