title: Replacing Entire Page Including Head Using Javascript
body: <p>I have a Javascript function that is passed a string.  The string that it is passed is an entire webpage, including the header.  I need the Javascript to replace the entire current page, head and all with the new content.</p>
  
  <p>Consider the following HTML file:</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
      &lt;script language="Javascript"&gt;
        &lt;!--
        var newContent='&lt;html&gt;&lt;head&gt;&lt;script language="Javascript"&gt;function Hi() {alert("Goodbye World");}&lt;/script&gt;&lt;/head&gt;&lt;body onload="Hi();"&gt;New Content&lt;/body&gt;&lt;/html&gt;';
        function ReplaceContent(NC) {
          document.body.innerHTML=NC;
        }
        function Hi() {
          alert("Hello World");
          ReplaceContent(newContent);
        }
        --&gt;
      &lt;/script&gt;
    &lt;/head&gt;
    &lt;body onload="Hi();"&gt;
      Original Content
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>In this case, the passed string is:</p>
  
  <pre><code>&lt;html&gt;&lt;head&gt;&lt;script language="Javascript"&gt;function Hi() {alert("Goodbye World");}&lt;/script&gt;&lt;/head&gt;&lt;body onload="Hi();"&gt;New Content&lt;/body&gt;&lt;/html&gt;
  </code></pre>
  
  <p>But of course, since the "ReplaceContent" function is only replacing the body, but not the header, I never get the "Goodbye World" alert.</p>
  
  <p><strong>Ignoring "why I would want to do this",</strong> How can I dynamically replace the entire page, including the header, and javascript functions?</p>
  
  <p>Please remember the "source" html ('newContent' above) exists only as a string, it does not exist on a server anywhere, so I cannot just redirect to it.</p>
  
  <p>What changes I make to "ReplaceContent" above to cause the "Goodbye World" alert to appear once the content is replaced?  <i>Please keep in mind I cannot know in advance the value of the newContent variable!!</i></p>