iframe从父级继承

一尘不染

iframe从父级继承

css

我该如何<iframe>继承其父代的样式和javascript。

我努力了

var parentHead = $("head", parent.document).html();
$("head").html(parentHead);

但是，它会删除<script>标签。此外，我看不到影响iframe的样式。

我是否有更好/其他的方法来解决这个问题？谢谢。

阅读 495

2020-05-16

共1个答案

一尘不染

您可以通过在iframe中使用以下代码来“继承”父级的CSS：

<head>
<script type="text/javascript">
window.onload = function() {
    if (parent) {
        var oHead = document.getElementsByTagName("head")[0];
        var arrStyleSheets = parent.document.getElementsByTagName("style");
        for (var i = 0; i < arrStyleSheets.length; i++)
            oHead.appendChild(arrStyleSheets[i].cloneNode(true));
    }
}
</script>
</head>

在IE，Chrome和Firefox中对我来说效果很好。

关于JavaScript，我找不到直接将父JavaScript添加到iframe中的方法，但是您可以parent.在父内部添加任何位置以使用JS，例如：

<button type="button" onclick="parent.MyFunc();">Click please</button>

MyFunc单击该按钮时，将调用父页面中定义的函数。

2020-05-16