In order to access this site you need to enable JavaScript!

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

clear method (selection)

Browser support:

Removes the contents of the current selection from the document.

Use the deleteFromDocument method for similar functionality in Firefox, Opera, Google Chrome and Safari.

If you only want to cancel the current selection, use the empty method.

Syntax:

object.clear ( );

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 clear method:

<head>
    <script type="text/javascript">
        function RemoveSelection () {
            if (document.selection) {
                document.selection.clear ();
            }
        }
    </script>
</head>
<body onmouseup="RemoveSelection ();">
    Select some content on this page with the mouse!
</body>

Copy Code

Preview

Syntax Highlighter

Did you find this example helpful? yes no

Example HTML code 2:

A cross-browser solution for the previous example:

<head>
    <script type="text/javascript">
        function RemoveSelection () {
            if (window.getSelection) {  // all browsers, except IE before version 9
                var selection = window.getSelection ();
                selection.deleteFromDocument ();

                    /* The deleteFromDocument does not work in Opera.
                        Work around this bug.*/
                if (!selection.isCollapsed) {
                    var selRange = selection.getRangeAt (0);
                    selRange.deleteContents ();
                }

                    // The deleteFromDocument works in IE,
                    // but a part of the new content becomes selected
                    // prevent the selection
                if (selection.anchorNode) {
                    selection.collapse (selection.anchorNode, selection.anchorOffset);
                }
            } 
            else {
                if (document.selection) {    // Internet Explorer
                    document.selection.clear ();
                }
            }
        }
    </script>
</head>
<body onmouseup="RemoveSelection ();">
    Select some content on this page with the mouse!
</body>