加载后更新 iframe 正文颜色答案

【问题标题】：Update iframe body color after load加载后更新 iframe 正文颜色
【发布时间】：2023-03-09 15:29:01
【问题描述】：

我有一个页面 ,page1.html 通过 iframe 加载 page2.html 。我需要更改 iframe 页面 (page2.html) 的正文颜色以覆盖 page2.html 上加载的 CSS 样式。（两个页面都在同一个域上）。如何通过 Javascript 进行更新？

【问题讨论】：

标签： javascript iframe

【解决方案1】：

用谷歌搜索一下：

Scripting IFrames

它建议 window.frames[iframeName].document 应该可以工作。

【讨论】：

【解决方案2】：

由于两个页面都位于同一个域中，所以应该很容易。

试试这个，

 var changeIFrameBodyColor = function()
 {
   var iFrame =  document.getElementById('iFrame');
   var iFrameBody;
   if ( iFrame.contentDocument ) 
   { // DOM
     var iFrameBody = iFrame.contentDocument.getElementdByTagName('body')[0];
   }
   else if ( iFrame.contentWindow ) 
   { // IE
     var iFrameBody = iFrame.contentWindow.document.getElementdByTagName('body')[0];
   }
   iFrameBody.style.color = '#ff0000';
 }
 <a href="javascript:;" onclick="changeIFrameBodyColor()">Change Color</a>
 <iframe id="iFrame" src="page2.html" ../>

【讨论】：

制作那个 getElementsByTagName