在Iframe页面中添加/更改css

adding/ changing css in Iframe page

本文关键字：更改 css 添加 Iframe      更新时间：2023-09-26

我的任务是在SharePoint 2013网站上使用这种方法，所以开始吧。

背景：-我在SharePoint 2013网站中有一个页面，该网站有一个"内容编辑器"Web部件，显示来自同一域/网站集中的页面。下面的代码（不是我的）我已经放在内容编辑器中，它显示的页面都很好。

问题-我的要求是从内容编辑器的页面中"删除globalnav"，我认为这是在使用Iframe。现在，我可以将F12开发工具与IE11一起使用，找到CSS类，即下面的-ms对话框#globalNavBox，并将显示设置为"none"这正是我想要的样子。

我唯一不知道如何在这里实现的是，如何通过在显示嵌入页面的页面上使用某种代码来实现这一点。？？

这是我在内容编辑器中用来显示我要修改的页面的代码。

#mydiv{
width:1280px; height:1000px;
 overflow:hidden;
 ;
}
#myframe{
 ;
 top:-190px;
 left:-100px;
 width:1080px;
 height:1000px;
}
</style>
<div id="mydiv">
<iframe id="myframe" src="/gen/genInduction/Lists...blah scrolling="no"></iframe>&#160;</div>

现在我不知道如何添加代码（如果可以的话）来删除css.ms对话框#globalNavBox｛display:none；｝，这样当页面显示时，globalnav就会被删除。

我希望这是有意义的，因为这是我第一次使用这个网站提问。在我问这个问题之前，我也搜索了无数次，并尝试了各种方法来实现这一点，但我就是不知道如何实现。

将以下内容放在iframe 之后的页面中

<script>
document.getElementById("myframe").contentDocument.getElementById("globalNavBox").style.display="none";
</script>

我相信您仍然可以访问iframe的内容，因为它们都属于同一个域，除非iframe是沙盒（示例清楚地表明它不是沙盒）。除了JBiserkov巧妙的精简回答之外，这将涵盖一些关于iframe加载的问题。在很多情况下，iframe可能会迟到一点，所以你应该做好准备。以下链接帮助我理解iframes：

Iframes、Onload和Document.domain

Iframe教程

-参考iframe

var iFrame = document.getElementById('myframe'),

-引用iframe的文档对象

-这个简写的条件表达式是访问iframe页面内任何内容的关键。

iDoc = iFrame.contentDocument ? iFrame.contentDocument : iFrame.contentWindow.document,

-参考目标元素#globalNavBox

gNav = iDoc.getElementById('globalNavBox');

-加载iframe时，将globalNavBox的样式抓取为"display"并设置为"none"

iframe.onload = function () {
        gNav.style.display = 'none';
};
相关文章：