CODEWITHSUNDEEP
javascriptiframe
Iris
Iris

Reputation:

Update iframe body color after load

I have a page ,page1.html that loads page2.html via an iframe . I need to change the body color of the iframe page (page2.html) to override the CSS style that's loaded on page2.html. (both pages are on same domain). How can that be updated via Javascript ?

Upvotes: 0

Views: 4577

Answers (2)

tan
tan

Reputation: 6105

Since both pages lives on the same domain it should be easy.

Try this,

 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" ../>

Upvotes: 0

Neil Bostrom
Neil Bostrom

Reputation: 2349

A bit of googling turn up this:

Scripting IFrames

It suggests window.frames[iframeName].document should work.

Upvotes: 2

Related Questions