将meta标记附加到iframe中主文档的头部

append meta tag to the head of the main document from iframe

本文关键字：文档 头部 iframe meta      更新时间：2023-09-26

所以我遇到了一个问题，我让一个文档做出了响应，但它显示在一个iframe中，其中父文档有错误的元标记。

我设置了一个测试，看看我是否能在iframe中完成。它将meta标记附加到iframe的头部，而不是主文档。有人有什么建议吗？

index.html

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Iframe Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<iframe id="testFrame" name="testFrame" src="iframe.html"></iframe>
</body>
</html>

iframe.html

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Iframe</title>
<script>
var viewPortTag=document.createElement('meta');
viewPortTag.id="viewport";
viewPortTag.name = "viewport";
viewPortTag.content = "width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;";
document.getElementsByTagName('head')[0].appendChild(viewPortTag);
</script>
</head>
<body>
Iframe Original Content
</body>
</html>

您可以这样做，但前提是iframe的域与顶级文档的域相同。

只需将您的代码更改为：

window.parent.document.getElementsByTagName('head')[0].appendChild(viewPortTag);

在iframe.html中使用window.parent.document而不是文档。假设两个文件都在同一域上。

var viewPortTag=document.createElement('meta');
viewPortTag.id="viewport";
viewPortTag.name = "viewport";
viewPortTag.content = "width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;";
window.parent.document.getElementsByTagName('head')[0].appendChild(viewPortTag);
相关文章：