Open In App

HTML DOM insertAdjacentElement() Method

Improve
Improve
Improve
Like Article
Like
Save Article
Save
Share
Report issue
Report

The insertAdjacentElement() method inserts the specified element at the specified position. The legal values for this position are.

  • afterbegin
  • afterend
  • beforebegin
  • beforeend

Syntax:

node.insertAdjacentElement(position, element)

Parameters: This method requires 2 parameters.

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

Return Value: The element that was inserted, or null, if the insertion failed. 

Exceptions: If the specified position is not recognized or if the specified element is not a valid element. 

Example: 

HTML




<!DOCTYPE html>
<html>
<head>
    <!--script to insert specified
        element to the specified position-->
    <script>
        function insadjele() {
            var s = document.getElementById("d1");
            var h = document.getElementById("head3");
            
            h.insertAdjacentElement("afterend", s);
        }
    </script>
</head>
  
<body>
    <h1> Welcome To GeeksforGeeks</h1>
    <div id="d1">div element</div>
    <h3 id="head3">header element</h3>
    <p>Click the button to insert 
      div element after the header element</p>
    <button onclick="insadjele()">Insert element</button>
  
</body>
</html>


Output: 

Before clicking insert element button: 

 

After clicking insert element button: 

 

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

  • Google Chrome 1 and above
  • Edge 17 and above
  • Firefox 48 and above
  • Opera 8 and above
  • Internet Explorer 5 and above
  • Safari 3 and above

Last Updated : 13 Jun, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads