在 facebook iframe 中添加自定义样式表答案

【问题标题】：Add a custom style sheet inside a facebook iframe在 facebook iframe 中添加自定义样式表
【发布时间】：2015-05-11 06:29:39
【问题描述】：

我想自定义 Facebook 提要的设计，为此我想在 Facebook iframe 中添加自定义样式表。

我有什么

<iframe width="1000px" height="1000px" frameborder="0" name="f1e348592ed856c" allowtransparency="true" allowfullscreen="true" scrolling="no" title="fb:page Facebook Social Plugin" style="border: medium none; visibility: visible; width: 340px; height: 500px;" src="http://www.facebook.com/v2.3/plugins/page.php?app_id=&amp;channel=http%3A%2F%2Fstatic.ak.facebook.com%2Fconnect%2Fxd_arbiter%2FKTWTb9MY5lw.js%3Fversion%3D41%23cb%3Df46f9e2a3b7b8%26domain%3D10.0.0.101%26origin%3Dhttp%253A%252F%252F10.0.0.101%252Ff24c367e49e04c%26relation%3Dparent.parent&amp;container_width=1584&amp;hide_cover=false&amp;href=https%3A%2F%2Fwww.facebook.com%2Ffacebook&amp;locale=en_US&amp;sdk=joey&amp;show_facepile=true&amp;show_posts=true" class=""></iframe>

我的尝试

$(document).ready(function(){              
var $head = $("iframe").contents().find("head");                
$head.append($("<link/>", 
    { rel: "stylesheet", href: "style.css", type: "text/css" }));

});

或

var cssLink = document.createElement("link") 
cssLink.href = "style.css"; 
cssLink .rel = "stylesheet"; 
cssLink .type = "text/css"; 
frames['iframe'].document.body.appendChild(cssLink);

我有很多谷歌，但找不到任何可行的解决方案。一些脚本在正常的 iframe 中工作，但在 facebook iframe 中没有任何工作。

我还创建了一个jsFiddle File

任何帮助将不胜感激！

【问题讨论】：

这样不行。您尝试访问跨域域 iframe
@OlegYudovich 我不知道跨域域 iframe，你在说这个吗{stackoverflow.com/questions/25098021/…}

标签： jquery html css facebook iframe

【解决方案1】：

您无法通过这种方式访问或更改 IFrame 内容，因为这是跨域 IFrame。您的浏览器将拒绝任何此类操作。这正是你得到的：http://screencast.com/t/Uu6TXWFW

【讨论】：

还有其他方法吗？？
是的。如果第二个域提供 API。 Api 调用或在 URL 中传递自定义参数或以某种方式自定义您的 IFrame
例如，我有一个网站：somesite.com，您想使用 IFrame 在您的网站：someanothersite.com 中显示我的网站页面。我告诉你：“你可以通过像这样传递这个参数来显示我的网站页面并自定义标题颜色：somesite.com?headercolor=red”，你可以在 IFrame url 中传递这个参数：somesite.com?headercolor=red" >

【解决方案2】：

是的，通常您可以修改 iframe 的内容、样式等，但前提是它不是跨域的 - 从您的域您不能修改 Facebook 的 iframe 的内容。

其次 - 我不确定是否符合 Facebook 的规定 - 我的意思是修改其小部件和插件的样式。

【讨论】：