使用JQuery修改iFrame

Question

我的网站上有一个Twitter小部件（嵌入iFrame的Javascript小部件）。以前，我用过

iframe[id^='twitter-widget-']{ width:100% !important;}

将小部件宽度更改为100％，而不是默认的520px。直到昨天它一直很好。不知何故，iframe上的CSS设置不再起作用。我检查了iFrame源代码，看来Twiiter添加了这个

.timeline {
  max-width: 520px;
 }

因为这个iframe来自twitter，我无法使用css来修改.timeline。我尝试使用Jquery / javascript：

$("#twitter-widget-0").contents().find(".timeline").css("max-width","100%");

但它似乎只适用于控制台。我将这行JavaScript放在PHP模板文件中，但它不起作用。我尝试了 body onLoad ，窗口上载和文档onload ，但无效。我也把这个javascript放在我的模板文件的末尾，它也没有。

如何解决此问题？

谢谢，

Answer 1

您不能使用JavaScript对任何跨域iFrame进行任何DOM操作！如果iFrame属于同一个域，那么只有你能够做到这一点！

查看这些相关问题

1. Can I apply CSS to the elements within an iframe?
2. How to apply CSS to iframe?

简而言之，没有。您不能将CSS应用于iframe中加载的HTML，除非您可以控制iframe中加载的页面。