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

isEqual method (TextRange)

Browser support:
Returns whether the current TextRange object is identical to the specified TextRange object.
You can also use the compareEndPoints and inRange methods to compare the placement of two TextRange objects in Internet Explorer.
In other browsers, use the compareBoundaryPoints method to compare the placement of two Range objects.

Syntax:

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

Parameters:

rangeToCompare
Required. Reference to a TextRange object to compare.

Return value:

Boolean. One of the following values:
false The two TextRange objects are not identical.
true The two TextRange objects are identical.

Example HTML code 1:

This example works around a bug of the isEqual method. If a range is created from the current selection where the selected content is the text content of an element and another range is aligned to the text content of this element, then the isEqual method returns false for these two ranges. Conclusion: use the compareEndPoints method for TextRange comparison.
<head>
    <script type="text/javascript">
        function TestPlacement () {
            var boldText = document.getElementById ("boldText");

            if (document.body.createTextRange) {            // Internet Explorer
                var boldRange = document.body.createTextRange ();
                boldRange.moveToElementText (boldText);

                var selRange = document.selection.createRange ();

                if (selRange.isEqual (boldRange)) {
                    alert ("The selected text and the bold text are the same.");
                }
                else {
                        // bug fix
                    var startPoints = selRange.compareEndPoints ("StartToStart", boldRange);
                    var endPoints = selRange.compareEndPoints ("EndToEnd", boldRange);
                    if (startPoints == 0 && endPoints == 0) {
                        alert ("The selected text and the bold text are the same, but the isEqual method returns false!");
                    }
                    else {
                        alert ("The selected text and the bold text are different.");
                    }
                }
            }
            else {
                alert ("Your browser does not support this example!");
            }
        }
    </script>
</head>
<body>
    Select some text on this page and use the following button to get information about 
    the placement of the <b id="boldText">bold text</b> relative to the selection.<br />
    Try to select the bold text exactly!
    <br /><br />
    <button onclick="TestPlacement ();">Test placement</button>
</body>
Did you find this example helpful? yes no

Supported by objects:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content