将iframe中的css类应用于主文档

Apply css class in iframe to main document

本文关键字：应用于 文档 css iframe 中的      更新时间：2023-09-26

我正在尝试将iframe的head中定义的CSS类应用于主文档中的元素。

除了用Javascript将类从iframe的头复制到主文档的头之外，有没有一种简单的方法可以访问该类并将其应用到主文档？

在主文档中这样的东西（显然不起作用）会很棒：

<div class="#iframe.classtoapply">lorem ipsum</div>

嘿，你可以这样做。。假设你有一个iframe，它看起来像这样，有类a和类b。代码

<head>
<style>
.a{color:red;}
.b{
color:blue;
}
</style>
</head>

现在假设你有一个主页面，像这样包含这个iframe。你可以这样写代码。结账

 <head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
</head>
<body>
<iframe src="youriframe.html"></iframe>
<span class="a" >Hi</span>
<span class="b" >It Worked</span>
<script>
$(function() {
    $('head').append('<style/>');
    setInterval(function() {
        if(typeof($('iframe').contents().find('head>style').html())!='undefined') {
            $('head>style').eq(0).append($('iframe').contents().find('head>style').html());
        }
    }
    ,1);
}
);
</script>
</body>
相关文章：