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

P

ProgrammerAnvesh

Improve

Article Tags :

Similar Reads

HTML DOM Strong Object

The Strong Object in HTML DOM is used to represent the HTML <strong> element. This tag is used to show the importance of the text. The strong element can be accessed by using the getElementById() method. Syntax: document.getElementById("id") Where id is assigned to the <strong> tag. Exam

HTML DOM Underline Object

The DOM underline object is used to represent the HTML <u> element. The underline element is accessed by getElementById(). Syntax: document.getElementById("id"); Where 'id' is the ID assigned to the <u> tag. Example 1: In this example, we will use the DOM underline object. HTML <!DOCT

HTML DOM Kbd Object

The Kbd Object in HTML DOM is used to represent the HTML <kbd> element. The <kbd> tag is the phrase tag and is used to define the keyboard input. The text enclosed by the <kbd> tag is typically displayed in the browserâ€™s default monospace font. The <kbd> element can be access

HTML DOM Italic Object

The Italic Object in HTML DOM is used to represent the HTML <i> element. This tag is used to display the content in italic style. The <i> element can be accessed by using the getElementById() method. Syntax: document.getElementById("id"); Where id is assigned to the <i> tag. Exampl

HTML DOM HashChangeEvent

The HashChangeEvent in HTML DOM is an interface between the events that are triggered when the hash of the URL has been changed. The anchor part of the URL follows the # symbol. Supported Tags <body> Properties/Methods: newURL: This property is used to return the URL of the document after the

HTML DOM removeAttributeNode() Method

The DOM removeAttributeNode() method is used to remove the specified attribute from the current element. It is similar to removeAttribute() method but the difference is that the removeAttribute method is used to remove the attribute with the specified name, but on the other hand removeAttributeNode

HTML DOM Superscript Object

The superscript object in HTML DOM is used to represent the HTML <sup> element. The superscript element can be accessed by using getElementById(). Syntax: document.getElementById("id") Where id is assigned to the <sup> tag. Example: In this example, we will use DOM Superscript Object HTM

HTML DOM replaceChild() Method

The replaceChild() method in HTML DOM is used to replace a child node with a new node within the given parent node. Syntax: parentNode.replaceChild( newChild, oldChild ) Parameter Values: This method accepts two parameters which are listed below: newChild: It is the required parameter. It represents

HTML DOM Subscript Object

The Subscript Object in HTML DOM is used to represent the HTML <sub> element. The subscript element can be accessed by using the getElementById() method. Syntax: document.getElementById("id") Where id is assigned to the <sub> tag. Example 1: In this example, we will use DOM Subscript Obj

HTML | DOM Fieldset Object

The DOM Fieldset Object is used to represent the HTML <fieldset> element. The fieldset element is accessed by getElementById(). Properties: disabled: disabled property used to set or return whether a fieldset is disabled, or not.form: use to return a reference to the form that contains the fie