computed-style-cross-window.html (1735B)
1 <!DOCTYPE HTML> 2 <html class="reftest-wait"> 3 <title>getComputedStyle across windows</title> 4 <style> 5 p { color: blue } 6 7 div { margin: 1em 0 } 8 </style> 9 10 <script> 11 12 var gRunCount = 2; 13 14 function run() { 15 if (--gRunCount != 0) 16 return; 17 18 var i = document.getElementById("i"); 19 20 var pout = document.getElementById("out"); 21 var poutnone = document.getElementById("outnone"); 22 var pin = i.contentDocument.getElementsByTagName("p")[0]; 23 var pinnone = i.contentDocument.getElementsByTagName("p")[1]; 24 25 document.getElementById("res1").style.color = 26 window.getComputedStyle(pin).color; 27 28 document.getElementById("res2").style.color = 29 i.contentWindow.getComputedStyle(pout).color; 30 31 document.getElementById("res3").style.color = 32 window.getComputedStyle(pinnone).color; 33 34 document.getElementById("res4").style.color = 35 i.contentWindow.getComputedStyle(poutnone).color; 36 37 document.documentElement.removeAttribute("class"); 38 } 39 40 </script> 41 <body onload="run()"> 42 43 <p id="out">This is a paragraph outside the iframe.</p> 44 <div style="display:none"><p id="outnone">This is a paragraph outside the iframe.</p></div> 45 46 <iframe id="i" src="computed-style-cross-window-inner.html" onload="run()"></iframe> 47 48 <div id="res1">This paragraph is the color that 49 outerWindow.getComputedStyle says the paragraph inside the iframe 50 is.</div> 51 52 <div id="res2">This paragraph is the color that 53 iframeWindow.getComputedStyle says the paragraph outside the iframe 54 is.</div> 55 56 <div id="res3">This paragraph is the color that 57 outerWindow.getComputedStyle says the display:none paragraph inside the 58 iframe is.</div> 59 60 <div id="res4">This paragraph is the color that 61 iframeWindow.getComputedStyle says the display:none paragraph outside 62 the iframe is.</div>