title: Dynamically Trigger HTML5 Cache Manifest file?
body: <p>I am using the new cache manifest functionality from HTML5 to cache my web app so it will work offline. The content is cached automatically when the page is loaded with the following html element:</p>
  
  <pre><code>&lt;html lang="en" manifest="offline.manifest"&gt;
  </code></pre>
  
  <p>This works fine. However, I want to give my users the option of whether they want the content cached offline. So, here is my question:</p>
  
  <p>Is there any way to trigger that an application be cached at runtime, using JavaScript, and not have it automatically done when the page is loaded.</p>
  
  <p>For example, something like this (using jquery):</p>
  
  <p>----------------index.html--------------
      
      </p>
  
  <pre><code>&lt;head&gt;
   &lt;meta charset="utf-8" /&gt;
  
   &lt;script src="http://code.jquery.com/jquery-1.4.4.min.js"&gt;&lt;/script&gt; 
   &lt;script type="text/javascript" src="Main.js"&gt;&lt;/script&gt; 
  
  &lt;/head&gt;
  &lt;body&gt;
  
   &lt;button id="cacheButton"&gt;Cache Page&lt;/button&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>---------Main.js---------</p>
  
  <pre><code>$(document).ready(
   function()
   {
    $('#cacheButton').click(onCacheButtonClick);
   }
  )
  
  function onCacheButtonClick(event)
  {
   console.log("Setting Offline Manifest");
   $('#htmlRoot').attr("manifest","offline.manifest");
  }
  </code></pre>
  
  <p>-------------offline.manifest-------------</p>
  
  <pre><code>CACHE MANIFEST
  
  #version .85
  
  #root
  index.html
  scripts/main.js
  
  #jquery assets
  http://code.jquery.com/jquery-1.4.4.min.js
  </code></pre>
  
  <p>Basically, when the button is clicked, I dynamically set the manifest attribute of the html element. This works (in the sense the element is set), but it does not cause the browser to then cache the page.</p>
  
  <p>Any suggestions?</p>