You are here: Reference > JavaScript > client-side > selection and ranges > methods > collapseToStart (selectionRange)

collapseToStart method (selectionRange)

Browser support:
Moves the end point of the current selectionRange object to its start point.
Note: The selectionRange object and its collapseToStart method are supported in Internet Explorer from version 9.
The selectionRange object represents the current selection.
If the direction of the selection is left-to-right, then the start point is the anchor point, else the focus point. When the anchor and focus points are at the same position, then no content is selected.
To move the start point to the end point, use the collapseToEnd method.
Use the anchorNode, anchorOffset, focusNode and focusOffset properties to retrieve the boundary points and the isCollapsed property to detect whether a selectionRange object is collapsed.


object.collapseToStart ( );
You can find the related objects in the Supported by objects section below.

Return value:

This method has no return value.

Example HTML code 1:

This example illustrates the use of the collapseToStart method:
    <script type="text/javascript">
        function CaretToSelBegin () {
            if (window.getSelection) {  // all browsers, except IE before version 9
                var selection = window.getSelection ();
                selection.collapseToStart ();
            else {  // Internet Explorer before version 9
                var textRange = document.selection.createRange ();
                textRange.collapse (true);
    <div onmouseup="CaretToSelBegin ()" contenteditable="true" style="width:400px; background-color:#e0f0d0;">
        Select some text with your mouse within this field.
        When the left button is released, the caret is placed 
        at the start point of the selection.
Did you find this example helpful? yes no

Supported by objects:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content