title: What is the simplest, cross-browser way to submit POST form with <a href>?
body: <p>I want to change many <code>&lt;a href&gt;</code> actions in my program to improve security and I'm looking to add hidden token to prevent <code>CSRF</code> attacks.</p>
  
  <p><strong>What is the simplest way to change <code>&lt;a href&gt;</code> action into <code>POST</code> request?</strong></p>
  
  <ul>
  <li>The solution should be cross-browser and work well on all major browsers i.e moz, IE, Chrome, Opera etc.</li>
  <li>it would be nice to have a pure JavaScript, without external dependencies</li>
  <li>it would be nice to avoid separate, quite large (comparing to <code>&lt;a href&gt;</code>) block of code</li>
  <li>it should be quite DOM-safe, so wrapping a clickable element in some decorator should not break the code (breakable example: <code>parentNode.submit();</code>)</li>
  <li>The clickable Tag should be an anchor i.e <code>&lt;a&gt;</code>, not <code>&lt;button&gt;</code> or <code>&lt;submit&gt;</code></li>
  <li>it should work with file upload/multipart form</li>
  </ul>
  
  <p>Non-POST action:</p>
  
  <pre><code>&lt;a href="/user/delete/4"&gt;DELETE&lt;/a&gt;
  </code></pre>
  
  <p>Target solution:</p>
  
  <pre><code>&lt;form method="post" target="/user/delete/4"&gt;
      &lt;a href="SUBMIT THIS FORM"&gt;DELETE&lt;/a&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>Maybe it would be better to style <code>&lt;input type="submit"&gt;</code> to look &amp; layer exactly like an <code>&lt;a&gt;</code> element?</p>