HTML DOM Range setEndBefore() method

The Range setEndBefore() method sets the end position of a Range relative to another Node. An element used to set the ending point range is referenceNode element. In this method the reference element used and its content is not included in the range.

Syntax:

range.setEndBefore(refNode);

Parameters:

  • referenceNode element: The Node which the sets the ending of the range.

Return Value: This method has no return value.

Example: This example will show how to set the ending position of the range using setEndBefore() method. Also in this example, I had used setStartAfter() method to set the starting of the range. The end reference node here is the second <i> element of the document.



For reference, i had also console logged the range in the text to make it clear.

filter_none

edit
close

play_arrow

link
brightness_4
code

<html>
<head>
<title>HTML DOM range setEndBefore() property</title>    
</head>
<body>
    <h1>GeeksforGeeks</h1>
    The range will start after 1st element in 
italics<i> RangeStart</i> This is range content 
<i>RangeEnd</i>
</body>
<script>
    var range = document.createRange();
    var refNode1 = document.getElementsByTagName("i").item(0);
    var refNode2 = document.getElementsByTagName("i").item(1);
    range.setStartAfter(refNode1);
    range.setEndBefore(refNode2);
    console.log(range);
    console.log(range.toString())
</script>
</html>

chevron_right


Output: In console, range made with startOffset and endOffset can be seen.

Supported Browsers:

  • Google Chrome
  • Edge
  • Firefox
  • Safari
  • Opera

full-stack-img

My Personal Notes arrow_drop_up

Check out this Author's contributed articles.

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.


Article Tags :
Practice Tags :


Be the First to upvote.


Please write to us at contribute@geeksforgeeks.org to report any issue with the above content.