title: How to ignore base href when using location.href="#_ElementId_"?
body: <p>If a webpage has a base href, is there anyway to ignore it when we're using #<em>ElementId</em>, without refreshing the page?</p>
  
  <p>Here's some code:</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
      &lt;base href="http://www.google.com/" /&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;div id="test"&gt;
        Test
      &lt;/div&gt;
      &lt;button onclick="location.href='#test'"&gt;Back to Test&lt;/button&gt;
      &lt;a href="#test"&gt;Back to Test!&lt;/a&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>When I click on either the button or the link, I want the browser to bring the page to div#test. Without the base href tag, everything works - However, with the base-href tag, I can't do it without the help of Javascript. Is there a way to do it in a more "natural" way?</p>
  
  <p>Below's a workaround that I have at the moment...</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
      &lt;base href="http://www.google.com/" /&gt;
      &lt;script type="text/javascript"&gt;
        function goToElement(elementId) {
          var baseTag = document.getElementsByTagName("base")[0];
          var existingBaseHref = baseTag.href;
          baseTag.href = "";
          location.href = "#" + elementId;
          baseTag.href = existingBaseHref;
        }
      &lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;div id="test"&gt;
        Test
      &lt;/div&gt;
      &lt;button onclick="goToElement('test')"&gt;Back to Test&lt;/button&gt;
      &lt;a onclick="goToElement('test')"&gt;Back to Test!&lt;/a&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>