javascript - 确定 IFrame 加载后何时渲染 iFrame 内容

使用 javascript，我创建一个 iframe，将其添加到父 DOM，然后通过 iFrameEl.contentWindow.document.write() 将 HTML 写入其中

我需要确定在调用 iFrameEl.contentWindow.document.close() 后何时渲染 iFrame 中的所有内容。

iFrame 的 onload 事件似乎是在 iframe 最初添加到 DOM 时调用的，在我可以写入它之前，我需要将其添加到 DOM 才能访问 iFrame 的 contentWindow.document，所以捕获22.

在 Chrome 中，作为替代方案，我使用 srcdoc 属性将我需要的所有内容添加到 iframe 并将 iframe 添加到 dom 并等待 onload 事件，但是 IE 不支持 srcdoc

    var iFrameHTML = '<!DOCTYPE html><html><head>';

    iFrameHTML = iFrameHTML + '</head><body>' + htmlIncludingImagesEtc + '</body></html>';

    iFrameEl.srcdoc = iFrameHTML;

    myDiv.append(iFrame);


    iFrameEl.onload = function(){ 

        //proceed
    }

我知道iFrame的src属性也可以使用，但是Data URI characters上的限制阻止我使用这种方法

我知道这里有很多类似的问题，但我找不到符合我要求的问题。

我需要动态创建一个 iFrame，向其中添加内容并确定何时渲染所有内容，是否有一些明显的方法可以实现此目的，或者是否需要 MutationObservers 等？

最佳答案

查看DOMFrameContentLoaded 。这是一个在加载并解析框架中的内容时将触发的事件。

关于javascript - 确定 IFrame 加载后何时渲染 iFrame 内容，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/40385498/