title: How to get a reference to an iframe's window object inside iframe's onload handler created from parent window
body: <h2>Before I paste any code, here's the scenario:</h2>
  <ol>
  <li>I have an HTML document that creates an empty iframe using JavaScript</li>
  <li>The JavaScript creates a function and attaches a reference to that function to the iframe's document object (using <code>doc.open()</code> to get a reference to the document)</li>
  <li>The function is then attached as an <code>onload</code> handler for the iframe's document (by writing <code>&lt;body onload=&quot;...&quot;&gt;</code> into the iframe.</li>
  </ol>
  <p>Now what has me stumped is that the global (window) and document objects inside the onload handler (while it's running) is different from the same objects run through JavaScript added via script nodes.</p>
  <h2>Here's the HTML:</h2>
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;script&gt;
  (function(){
    var dom,doc,where,iframe;
  
    iframe = document.createElement('iframe');
    iframe.src=&quot;javascript:false&quot;;
  
    where = document.getElementsByTagName('script')[0];
    where.parentNode.insertBefore(iframe, where);
  
    doc = iframe.contentWindow.document;
  
    var _doc = document;
  
    doc.open()._l=function() {
      // the window object should be the one that doc is inside
      window.vanishing_global=new Date().getTime();
  
      var js = this.createElement(&quot;script&quot;);
      js.src = 'test-vanishing-global.js?' + window.vanishing_global;
  
      window.name=&quot;foobar&quot;;
      this.foobar=&quot;foobar:&quot; + Math.random();
      document.foobar=&quot;barfoo:&quot; + Math.random();
  
      // `this` should be the document object, but it's not
      console.log(&quot;this == document: %s&quot;, this == document);
      console.log(&quot;this == doc:      %s&quot;, this == doc);
  
      // the next two lines added based on @Ian's comment below
      console.log(&quot;_doc == document: %s&quot;, _doc == document);
      console.log(&quot;_doc == doc:      %s&quot;, _doc == doc);
  
      console.log(&quot;name: &quot; + window.name + &quot;\n&quot; + &quot;window.vanishing_global: &quot; + window.vanishing_global + &quot;\ntypeof window.vanishing_global: &quot; + typeof window.vanishing_global + &quot;\ndocument.foobar: &quot; + document.foobar);
      this.body.appendChild(js);
    };
    doc.write('&lt;body onload=&quot;document._l();&quot;&gt;&lt;/body&gt;');
    doc.close();
  })();
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  <h2>And here's <code>test-vanishing-global.js</code>:</h2>
  <pre><code>console.log(&quot;name: &quot; + window.name + &quot;\n&quot; + &quot;window.vanishing_global: &quot; + window.vanishing_global + &quot;\ntypeof window.vanishing_global: &quot; + typeof window.vanishing_global + &quot;\ndocument.foobar: &quot; + document.foobar);
  </code></pre>
  <h2>Instructions:</h2>
  <p>Put these two files into a directory, and open the HTML in a browser (tested in latest Chrome and Firefox, same result in both).</p>
  <h2>This is the output I get:</h2>
  <pre><code>this == document: false
  this == doc:      true
  _doc == document: true
  _doc == doc:      false
  
  name: foobar
  window.vanishing_global: 1366037771608
  typeof window.vanishing_global: number
  document.foobar: barfoo:0.9013048021588475
  
  name: 
  window.vanishing_global: undefined
  typeof window.vanishing_global: undefined
  document.foobar: foobar:0.5015988759696484
  </code></pre>
  <p>The <code>this</code> object inside the handler should be either the document object.  It <em>is</em> a document object, but not the same document object as the document that it runs inside (it's also not the same as the parent document).  The window object inside the handler is also not the same as the window object that runs in JavaScript loaded in the page.</p>
  <h2>So finally my question:</h2>
  <p>Does anyone know what's going on, and how I can either get a reference to the actual window object, or at least declare and reference global variable from the same global context?</p>
  <h2>Footnotes:</h2>
  <p>There are no cross-domain issues with this iframe since they're on the same domain.  There is an issue if someone sets <code>document.domain</code>, but that's not being done in this example code.</p>