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/