Rob*_*ben 43 html javascript css iframe jquery
如何<iframe>继承其父级样式和javascript.
我试过了
var parentHead = $("head", parent.document).html();
$("head").html(parentHead);
但是,它剥离了<script>标签.而且,我没有看到影响我的iframe的样式.
我错过了更好/任何其他方法吗？谢谢.
Sha*_*ard 47
您可以通过在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在单击按钮时调用父页面中定义的函数.
Tob*_*s81 22
这是我添加iframe父级(不是脚本)样式的"最佳"解决方案.它适用于IE6-11,Firefox,Chrome,(旧)Opera,可能无处不在.
function importParentStyles() {
var parentStyleSheets = parent.document.styleSheets;
var cssString = "";
for (var i = 0, count = parentStyleSheets.length; i < count; ++i) {
if (parentStyleSheets[i].cssRules) {
var cssRules = parentStyleSheets[i].cssRules;
for (var j = 0, countJ = cssRules.length; j < countJ; ++j)
cssString += cssRules[j].cssText;
}
else
cssString += parentStyleSheets[i].cssText; // IE8 and earlier
}
var style = document.createElement("style");
style.type = "text/css";
try {
style.innerHTML = cssString;
}
catch (ex) {
style.styleSheet.cssText = cssString; // IE8 and earlier
}
document.getElementsByTagName("head")[0].appendChild(style);
}