title: What is anchorNode , baseNode , extentNode and focusNode in the object returned by document.getSelection?
body: <p>If I make a selection in a html page and I do : </p>
  
  <pre><code>var a = document.getSelection()
  </code></pre>
  
  <p>I get an object with four properties :</p>
  
  <ol>
  <li>anchorNode </li>
  <li>baseNode</li>
  <li>extentNode </li>
  <li>focusNode</li>
  </ol>
  
  <p>the values of first three is the same i.e. the text that I have selected but how are they different and which one to use? </p>