Sunday, November 17, 2024
Google search engine
HomeLanguagesJavascriptHTML DOM Range setEndBefore() method

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 the 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 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 the setEndBefore() method. Also in this example, we used the setStartAfter() method to set the starting of the range. The end reference node here is the second <i> element of the document.

HTML




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


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

Supported Browsers:

  • Google Chrome 1
  • Edge 12
  • Firefox 1
  • Safari 1
  • Opera 9
  • Internet Explorer 9
Whether you’re preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, neveropen Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we’ve already empowered, and we’re here to do the same for you. Don’t miss out – check it out now!

RELATED ARTICLES

Most Popular

Recent Comments