HTML DOM insertAdjacentText() Method

Last Updated : 15 Jun, 2023

The insertAdjacentText() inserts a provided text at one of the following positions.

  • afterbegin:
  • afterend:
  • beforebegin:
  • beforeend:

Syntax:

node.insertAdjacentText(position, text)

Parameters: This method requires 2 parameters.

  • position: A position relative to the element. The legal values are:
    • afterbegin: Just inside the element, before its first child.
    • afterend: After the element itself.
    • beforebegin: Before the element itself.
    • beforeend: Just inside the element, after its last child.
  • text: The text you want to insert.

Return Value: No Return Value. 

Exceptions: If the specified position is not recognized. 

Example: In this example, we will use insertAdjacentText().

HTML 
<!DOCTYPE html>
<html>

<head>
    <title>
        HTML DOM insertAdjacentText() Method
    </title>
</head>

<body>
    <h1> Welcome To GeeksforGeeks</h1>
    <strong>
        <p id="m1">GeeksforGeeks is a </p>
    </strong>
    <p>
        Click the button to insert some
        text after the sentence:
    </p>
    <button onclick="insadjtxt()">
        Insert text
    </button>
  
   <!--script to insert specified
        element to specified position-->
    <script>
        function insadjtxt() {
            let h = document.getElementById("m1");
            h.insertAdjacentText("beforeend",
                " Computer Science Portal.");
        }
    </script>
</body>

</html>

Output: 

 

Supported Browsers: The browser supported by DOM insertAdjacentText() Method are listed below:

  • Google Chrome 1 and above
  • Edge 17 and above
  • Internet Explorer 5 and above
  • Firefox 48 and above
  • Opera 12.1 and above
  • Apple Safari 4 and above
Comment

Explore