【问题标题】:How to autoload iframe elements如何自动加载 iframe 元素
【发布时间】:2017-06-23 23:02:54
【问题描述】:

我有一个包含大约 12 个 iframe 元素的投资组合页面。我想知道是否有办法缓存或自动加载 iframe 元素,这样我就不需要在每次网站加载时都重新加载。

这是我的 iframe 元素的样子:

<iframe src="http://iframe.url" width="300" height="600" frameborder="0"></iframe>

iframe 元素包含横幅广告,由图像、HTML 和 JS 代码组成。请让我知道如何完成这项任务。感谢您的帮助!

【问题讨论】:

  • 您是否尝试过使用 jQuery 更改 iframe src 属性? $("#some-iframe").attr("src", "http://iframe.url");?
  • 所以您在 iFrame 中有“一组”广告,并且您想在用户不刷新页面的情况下将一个广告更改为另一个广告?您肯定在寻找上面的 AfikDeri 的行来更改 iFrame。我会补充说您正在寻找一个setTimeout() 函数,该函数会随着时间的推移自动替换它们。构建一个链接数组,并将其传递到一个循环中,该循环根据循环索引随时间改变 src 属性:)
  • 感谢您的回复。不幸的是,我不想换掉图像,我仍然希望它们在单独的 iFrame 中可见(目前它们在存储桶中),但我希望它们加载速度更快,尤其是在移动设备上。

标签: javascript jquery html iframe


【解决方案1】:

我在这里引用信息。如果我明白你想要什么,这看起来很有希望。

友好的 iframe

此技术适用于广告。这不是真正的 iframe 加载 技术,但更多的是使用 iframe 来保存广告的方法。魔法 不在于 iframe 的加载方式,而在于主页面的加载方式, iframe 和广告代码一起工作。它的工作原理是这样的:

  1. 创建一个 iframe。将源设置为来自同一域的小型静态 html 页面

  2. 在 iframe 中,设置 JavaScript 变量 inDapIF = true 来告诉广告它是在友好的 iframe 中加载的

  3. 在 iframe 中,创建一个以广告 URL 为源的脚本元素。像普通 JavaScript 广告一样加载广告

  4. 广告加载完成后,调整 iframe 的大小以适合广告的尺寸。

友好的 iframe 适用于所有浏览器。

列出了其他技术,但这似乎适合您的用例。其他方法见Iframe loading techniques and performance

如果您想要一种强制 iFrame 重新加载的方法,这里有一个 SO 答案。 How to force an iFrame to reload once it loads

【讨论】:

  • 这似乎真的加快了我的广告加载时间!谢谢!
  • 没问题!很高兴我能提供帮助。我知道花大量时间玩 iFrame 是什么感觉。
【解决方案2】:

您可以在 iframe 中为 url 设置 html 元标记。

<META HTTP-EQUIV="EXPIRES"
CONTENT="Mon, 22 Jul 2018 11:12:01 GMT">

这将缓存 iframe 的结果。

您甚至可以使用 AJAX 来加载内容。这不会重新加载整个页面,而是动态更改内容。缓存 AJAX 结果以节省带宽。

【讨论】:

  • 如果您要添加更多解释,请编辑您的答案,而不是留下评论。请参阅comment everywhere...上的我应该什么时候发表评论?什么时候不应该我发表评论?
  • 感谢您的回复。我应该在哪里添加这段代码?
猜你喜欢
  • 2017-07-14
  • 2021-04-05
  • 2016-09-21
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-03-05
  • 2011-09-20
  • 1970-01-01
相关资源
最近更新 更多