title: Get a variable in an iframe from the parent
body: <p>How do I get a variable in an iframe from the parent if I do not know how many iframes are on the parent page and the order of the one in question.  For instance, I know the iframe in question is the second one, so I can select <code>windows.frames[1]</code>.  But if I didn't know know it was the second one, how would I select it by ID.</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; 
  &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; 
      &lt;head&gt; 
          &lt;meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" /&gt; 
          &lt;title&gt;Testing&lt;/title&gt;  
          &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js" type="text/javascript"&gt;&lt;/script&gt;
          &lt;style type="text/css"&gt;
          &lt;/style&gt; 
          &lt;script type="text/javascript"&gt; 
              $(function(){
                  $('#getValues').click(function(){
                      //This works, but I don't want to select the iframe by the number since I don't know it.
                      console.log(
                          window.frames[1],
                          window.frames[1].window,
                          window.frames[1].window.getMe
                      );
                      console.log(
                          window.frames['myIFrame'],
                          window.frames['myIFrame'].document,
                          window.frames['myIFrame'].window,
                          document.getElementById('myIFrame'),
                          document.getElementById('myIFrame').window
                      );
                  });
              });
          &lt;/script&gt;
      &lt;/head&gt;
  
      &lt;body&gt;
          &lt;button id="getValues"&gt;getValues&lt;/button&gt;
          &lt;div&gt;&lt;iframe src="otherIframe.html"&gt;&lt;/iframe&gt;&lt;/div&gt;
          &lt;!-- iframe3_get.html only sets global variable getMe to something. --&gt;
          &lt;div&gt;&lt;iframe id="myIFrame" src="iframe3_get.html"&gt;&lt;/iframe&gt;&lt;/div&gt;
      &lt;/body&gt; 
  &lt;/html&gt; 
  </code></pre>