如何在iframe加载后创建iframe并销毁元素？

Question

我能够使用appendChild创建一个iframe，没有jquery，我是否可以知道iframe何时加载然后能够销毁该元素？

Answer 1

您可以使用onLoad事件。

 <iframe onload="this.parentNode.removeChild(this);" src="/"></iframe>

此处示例：http://jsfiddle.net/mSZ4X/1/

或者使用纯JavaScript：

var iframe = document.createElement("iframe");

iframe.src = "/";
iframe.onload = function() {
    this.parentNode.removeChild(this);    
};

document.body.appendChild(iframe);

此处示例：http://jsfiddle.net/mSZ4X/2/

Answer 2

假设您拥有在变量“myIframe”中创建的iframe DOM元素，您可以执行以下操作：

myIframe.onload = function() {
    setTimeout(function() {
        myIframe.parentElement.removeChild(myIframe);
    }, 0);
}

加载iframe的内容时会触发onload事件。你可以在onload处理程序中立即调用removeChild，但我已经看到一些浏览器（我认为是Firefox）继续认为iframe正在加载，如果你立即删除它。要解决这个问题，只需在0毫秒setTimeout中删除，浏览器就会在下一个最早的时刻调用该代码。