Question

我正在尝试找到一种快速而肮脏的解决方案来设置一些iframe内容。

我发现这个解决方案似乎非常适合我想要的东西（非常古老的遗产网站并不一定非常完美），但我无法让它发挥作用。

这应该做的是将我已定义的<style>附加到我的iframe中的<head>。

window.onload = styleOffers;
function styleOffers(){
console.log('running');
$('iframe').load( function() {
    $('iframe').contents().find("head")
      .append($("<style type='text/css'>#offer4{outline:1px solid red;}</style>"));
});
}

但我似乎没有看到任何样式应用于#offer4

console.log确认它正在运行该功能。只是没有风格附加:(

Answer 1

如果iFrame与父级不属于同一个域，则无法进行此操作。来自comment section below the answer from which you got the script：

＆＃34;仅当iFrame内容来自同一个父域时才有效。＆＃34;

此外，accepted answer to the same question涵盖了这一点。如果可以通过iFrame修改外部页面，则会引入大量的XSS漏洞，所以不幸的是，您无法实现的目标。

使用JS和iframe将样式标记添加到头部

1 个答案: