Question

我有一个需要将CSS附加到其中的iframe。它适用于除IE / Edge以外的所有浏览器。我需要在此iframe中隐藏标题，而我正在使用.append这样做。

我尝试了.append("<style type='text/css'> #header {display: none;}</style>');，也尝试了-ms-high-contrast媒体查询。

$(document).ready(function(){
    $('iframe').load( function() {
        $('iframe').contents().find("head")
            .append("<style type='text/css'> #header {display: none 
 !important;}</style>"); 
    });
});

我希望ID为#header的div在iframe中隐藏在IE / Edge浏览器中。

Answer 1

直接修改#header div会容易得多，如下所示：

$("iframe").contents().find("#header").css({display:"none"});

或非jQuery版本：

document.querySelector('iframe').contentDocument.querySelector("#header").style.display="none";

请注意，如果您自己的页面不在drury.edu，则contents()将无法正常工作。浏览器不允许您框住别人的网站，然后胡闹。

CSS的.append不会影响IE / Edge中的iframe

1 个答案: