Загрузка нескольких фреймов без перезагрузки родительской страницы

Question

У меня есть несколько фреймов, которые я загружаю на страницу, моя цель - загрузить эти фреймы сразу после того, как родительская страница закончила загрузку, однако я не хочу, чтобы родительская страница перезагружалась при загрузке фреймов. Я попытался добавить прослушиватель событий, когда окно родительской страницы завершило загрузку, затем go вперед и добавить iframe на страницу. Однако это приводит к перезагрузке родительской страницы. Ссылка на код ниже. Также просто добавьте iframe из другого домена в качестве родительской страницы.

const iFrameResize = (obj) => { console.log(obj) }
const style = "Bla";
window.onload = function() {
  console.log('hey..........')
  var iframe = document.createElement('iframe')
  iframe.sandbox = "allow-same-origin allow-scripts allow-popups allow-forms"
  iframe.src = "https://iframe.domain.com"
  iframe.width = "100%"
  iframe.frameBorder = "0"
  iframe.id = "iframe-1"
  iframe.onload = function onloadHandler(e) {
    var iframe = e.target
    var iframeId = '#' + iframe.id
    iFrameResize({
      log: true
    }, iframeId)
    iframe.contentWindow.postMessage(style, "*");
  }
  document.body.appendChild(iframe)
}

Answer 1

Если это правда, что window.onload пузыри, возможно, попробуйте это

const iFrameResize = (obj,sel) => {
  console.log(obj,sel)
  document.querySelector(sel).style.display="block";
}
const style = "Bla";

function onloadHandler(e) {
  const iFrame = e.target;
  console.log(iFrame.src)
  const iframeSelector = '#' + iFrame.id
  iFrameResize({
    log: true
  }, iframeSelector)
  iFrame.contentWindow.postMessage(style, "*");
}

window.addEventListener("load", e => {
  console.log(e.target.location.href)
  const iframe = document.createElement('iframe')
  iframe.sandbox = "allow-same-origin allow-scripts allow-popups allow-forms"
  iframe.width = "100%"
  iframe.frameBorder = "0"
  iframe.style.display="none";
  iframe.id = "iframe-"+document.querySelectorAll("iframe").length;
  iframe.addEventListener("load", onloadHandler);
  iframe.src = "https://google.com/search?q="+iframe.id
  document.body.appendChild(iframe)
})