将外部样式表链接到iframe中的页面

Question

我已经检查了很多其他问题，但仍然没有运气。

我在我的本地机器上使用chrome。

我有welcome.html（主页）和test.html（iframe页面） 然后我有了style.css。

目标：在我的welcome.html页面中将test.html作为iframe。但是使用jQuery设置iframe（test.html）。

所以我在welcome.html

中有这个

<script src="https://code.jquery.com/jquery-1.10.1.min.js"></script>

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

然后在body标签内

<iframe name='iframe' id="iframe" src="test.html"></iframe>

iframe正在运行，但在检查iframe时没有附加任何样式。

Answer 1

我假设您无法直接编辑iframe源代码？最简单的解决方案是在那里添加<link>标记。

但是，您的真正问题可能是找不到css文件。 src标记中的<link>属性需要相对于iframe的位置。如果iframe位于其他某个域上，则需要一个绝对路径（在您的情况下可能是"http://localhost/whatever/style.css"）。