javascript - What is anchorNode , baseNode , extentNode and focusNode in the object returned by document.getSelection? -

if make selection in html page , :

var = document.getselection()

i object 4 properties :

the values of first 3 same i.e. text have selected how different , 1 use?

according mdn

selection.anchornode - returns node in selection begins.

selection.focusnode - returns node in selection ends.

because there debates on naming, basenode alias anchornode, extentnode focusnode

the following beyond scope of question, i'll post anyway, found selection tricky part in scenarios.

take @ example:

<p>ab12<sup>3</sup>4567890 !</p>

let's we've made selection "1234567890". i've made picture explain anchor , focus nodes , offsets are.

WINAPI