如何将外部样式表和 javascript 导入 iframe

Posted 2023-03-06

【中文标题】如何将外部样式表和 javascript 导入 iframe

【英文标题】：how to import external stylesheet and javascript into an iframe

【发布时间】：2013-01-05 14:52:05

【问题描述】：

我只想将外部样式表和 js 导入 iframe 的 head 标签。有可能吗？

我已经在 html 头中尝试了一个自定义 jquery 函数`

$(this).contents().find('head').append('<link href="http://mywebsite.com/css/iframe.css?" rel="stylesheet" type="text/css" />')`

【问题讨论】：

我怀疑 iframe 在您包含样式表时已经呈现，因此这将不起作用。您无法访问要包含在 iframe 中的页面吗？

@drmonkeyninja 我无法访问我正在调用的页面，但需要在其中进行一些 CSS 更改，并在其中包含自定义滚动条。

出于安全原因，我认为这是不可能的。这样您就可以轻松更改汇款信息等..

“mywebsite”真的是你的网站吗？

no "mywebsite" 不是我的，但我保留了 'mywebsite' 作为文本来隐藏我的原始网站。

【参考方案1】：

我认为不可能使用 javascript 在 iframe 中包含样式表，因为在添加样式表之前该框架已经呈现。

您可以使用.find().css() 更改 iframe 的 DOM 中元素的样式。 （我已经为带有 iFrame 预览窗格的网站构建主题生成器做了类似的事情）。

如果 iFrame 来自其他人的网站，您应该警惕更改其 CSS，因为他们可能随时更改自己的 CSS 或标记，这可能会破坏您想要实现的目标。

【参考方案2】：

iframe 中的 window 对象是加载到 iframe 中的页面的属性。包含页面操作 iframe 窗口对象的唯一方法是包含页面和 iframe 页面的域是否相同。 （由于跨域限制政策）