为什么不同 div 元素中的 iframe 不起作用？答案

【问题标题】：Why don't iframes in different div element work?为什么不同 div 元素中的 iframe 不起作用？
【发布时间】：2013-07-05 10:56:28
【问题描述】：

Fiddle

为什么只有一个 iframe 可以同时工作？我的 javascript 有问题吗？

function test(){
    document.getElementById('src1').src='http://cnn.com/'
}
function test1(){
    document.getElementById('src2').src='http://stackoverflow.com/'
}


test();
test1();

【问题讨论】：

问题不在于 iframe 本身，而在于第二个 iframe 试图加载的链接。使用 iFrame 时，您必须注意一些安全问题。

标签： javascript html iframe

【解决方案1】：

确实有效，只是 stackoverflow 出于安全原因阻止您将其 URL 嵌入iframe ...

您可能会看到，即使是 Google 也禁止用户将要在 iframe 中使用的 google URL 嵌入

function test1(){ //Alter the URL in this function
    document.getElementById('src2').src='https://stackoverflow.com/'
}

Demo

Prevent iframe stealing

【讨论】：

我正在尝试与 Youtube 和 CNN 合作。如果没有 CNN，youtube 视频会完美地进入 iframe，但使用 CNN，youtube iframe 会显示为空白。有没有办法解决这个问题？

【解决方案2】：

这不是因为有两个 iframe，而是因为 stackoverflow 有一个特殊的标头：

X-Frame-Options 设置为 SAMEORIGIN

该标头阻止浏览器在 iframe 内呈现页面

在这里阅读更多：

X-Frame-Options

【讨论】：