如何将一行CSS应用于外部iframe？

我必须在客户端的网站上包含外部托管的iframe，并且我想更改body元素的背景颜色。我试过了：如何将一行CSS应用于外部iframe？

<script type="text/javascript"> 
function makeitblackgoddamnit(){ 
    top.frames['bookings'].document.body.style.backgroundColor = "black"; 
} 
</script> 

<iframe src="http://www.booking.com/? 
aid=123456&tmpl=searchbox&ss=&width=250&bgcolor=000000&textcolor=FFFFFF 
&label=label"width="250px" style="margin-left:20px;border:none;" height="250px" 
frameborder="none" scrolling="no" style="background-color:black;" name="bookings" 
onload="javascript:makeitblackgoddamnit();"> 
</iframe>

但它不起作用。我也尝试了一些其他版本，但我不想加载外部样式表。我不能使用任何JS库。你能帮我吗？

来源

2011-08-30 Bl3tchley

可能要你的函数名工作:) –

JavaScript不明白亵渎：d –

现在现在，语义功能名称是最有用的 –

你不能。允许访问（读或写）到远程网站的DOM将允许各种恶意攻击，所以browsers don't。

来源

2011-08-30 15:11:20 Quentin

的浏览器应最少解释iframe元素的背景颜色......：/ – Bl3tchley

@ Bl3tchley - ...它完全被加载到框架中的文档的主体元素的背景颜色所覆盖。 – Quentin

这是可能的唯一方法是如果您可以更改客户端网站内引用的CSS。否则，您无法对跨域iFrame执行任何操作。

来源

2011-08-30 15:11:29

iframe受same origin policy约束，除非当前域和iframe域匹配，否则您无法使用JavaScript（或CSS，iirc）与它们进行交互。

来源

2011-08-30 15:12:35

我有一个类似的问题，但不同的是，我实际上没有设置iframe的源代码我插入我想要使用jQuery的html。我的问题是，我不知道如何将样式表包含到iframe中。

检查下面的代码：

<button id="print1" onclick=" $('#frame1').contents().find('body').html($('#div1').html() + $('#tabs-4').html() + $('#tabs-5').html()+ $('#tabs-6').html()); window.frames['frame1'].print();">Print full report</button> 
<iframe id="frame1" style="visibility:hidden;" height=1px></iframe>

来源

2013-07-30 20:31:47 Damarawy

除非你有权访问iframe内容本身（iframe中的文件） – Ennui

@Ennui正如我之前提到的，我没有在这里设置'src'属性，我设置了iframe当按钮的'onclick'事件触发时 – Damarawy

请**不要在答案中提出新问题**。如果您遇到困难，请先搜索答案，并提出您自己的问题。（如果你认为它是相关的，你总是可以在你自己的问题中引用这个问题。） – Pevara

如何将一行CSS应用于外部iframe？

回答

相关问题