如何避免加载iframe的源代码

how to avoid loading the source for iframe

本文关键字：源代码 iframe 加载 何避免      更新时间：2023-09-26

我想提高一个页面的加载性能，这个页面有一个按钮来触发最初隐藏在页面上的弹出窗口（使用twitter引导程序中的"模态"组件）。这个弹出框体包含一个iframe，该源加载在页面的初始加载中，增加了大约30-40%的加载时间。在点击按钮弹出带有iframe的弹出窗口之前，不需要加载iframe源。如何避免在初始页面加载时加载iframe源。。。只在单击按钮时加载iframe源？JS可以在这里使用吗？如果是，那么如何或什么方法/库？有没有比在页面中隐藏iframe弹出更好的方法来缩短加载时间？谢谢

这在JavaScript中是可能的（不需要额外的库）。只需使用一个函数来设置src/在单击链接或按钮时显示框架。

function loadIFrame(frameID, url) {
    var frame = document.getElementById(frameID);
    frame.setAttribute('src', url);
    frame.style.display = 'block';
}

请参阅此处的示例：http://jsfiddle.net/ZNGmy/

与其将弹出窗口作为按钮可见的隐藏容器，不如将带有iframe内容的弹出窗口作为单独的html页面，通过按下按钮显示。这样，在按下按钮之前不会加载内容。

这个链接有一个弹出html页面的例子。http://allwebco-templates.com/support/S_add_pop.htm

相关文章：