title: Save a page after editing it with Javascript?
body: <p>Now, everyone knows the cute little trick where you punch this Javascript code into your browser's URL bar:</p>
  
  <pre><code>document.body.contentEditable = 'true'; document.designMode = 'on'; void 0
  </code></pre>
  
  <p>And El Presto! You can start freely editing a website just how you want it.</p>
  
  <p>The only problem is - you can't save it!</p>
  
  <p>After doing some quick research, I found that most likely, the best way to save this was by the method <a href="http://answers.yahoo.com/question/index?qid=20090909082655AAHP56T" rel="nofollow">suggested here</a>, which consists of somehow turning the page into a giant form and posting it to a MySQL database.</p>
  
  <p>Sure, while doing this is great, it's going to end up saving my whole page - and not just the section or container that I want to edit - and that's a major problem because us developers need to preserve lines of code such as...</p>
  
  <pre><code>&lt;?php include('header.php'); ?&gt;
  </code></pre>
  
  <p>...that aren't outputted in the HTML. In other words: it's going to save my page as it appears in outputted HTML, overwriting what is in my original PHP file.</p>
  
  <p>What I'm asking how to do, is how would I go about saving a website edited like this, but just to save or update one or two editable containers on the website (not the whole thing so my PHP code doesn't get overwritten)?</p>
  
  <p>For example:</p>
  
  <pre><code>&lt;p&gt;This Won't get updated when the page is "saved"&lt;/p&gt;
  &lt;div id="update-this-contianer"&gt;
     This area will be passed on to the MySql database, and then updated into the same section of the original file.
  &lt;/div&gt;&lt;!-- End Area To Update --&gt;
  </code></pre>