javascript - 如何避免加载 iframe 源

Question

我想提高页面的加载性能，该页面有一个按钮来触发最初隐藏在页面上的弹出窗口(使用 Twitter Bootstrap 中的“模态”组件)。此弹出正文包含一个 iframe，该源在页面初始加载时加载，但是加载时间增加了大约 30-40%。在单击按钮弹出带有 iframe 的弹出窗口之前，不需要加载 iframe 源。如何避免在初始页面加载时加载 iframe 源？ ...仅在单击按钮时加载 iframe 源？这里可以使用JS吗？如果是这样，那么如何或什么方法/库？有没有比在页面中隐藏 iframe 的弹出窗口更好的方法来缩短加载时间？谢谢您

Answer 1

这可以通过 JavaScript 实现(不需要额外的库)。 只需使用一个函数来设置 src/在单击链接或按钮时显示框架。

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

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