In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > HTML DOM > methods > removeNode

removeNode method

Browser support:

Removes the current element with or without its children from the document tree.

If you want to remove an element with its children, use the cross-browser removeChild method instead.

Example 2 demonstrates a cross-browser solution to remove an element without its children.

Syntax:

object.removeNode (removeChildren);

You can find the related objects in the Supported by objects section below.

Parameters:

removeChildren

Required in Opera and optional in Internet Explorer. Boolean that specifies whether child elements of the current element should also be removed.

One of the following values:

false

Default. Do not remove the child elements.

true

Remove the child elements as well.

Return value:

Returns the removed element.

Example HTML code 1:

This example illustrates the use of the removeNode method:

<head>
    <script type="text/javascript">
        function RemoveBold () {
            var boldTag = document.getElementById ("bold");
            if (boldTag) {
                if (boldTag.removeNode) {
                    boldTag.removeNode (false);
                }
                else {
                    alert ("Your browser does not support the removeNode method!");
                }
            }
        }
    </script>
</head>
<body>
    <b id="bold">
        Some text in bold
        <span style="color:red">Some red text in bold</span>
    </b>
    <br /><br />
    <button onclick="RemoveBold ();">Remove the bold style!</button>
</body>

Copy Code

Preview

Syntax Highlighter

Did you find this example helpful? yes no

Example HTML code 2:

This example illustrates a cross-browser solution for the previuos one:

<head>
    <script type="text/javascript">
        function RemoveElement (element) {
            while (element.firstChild) {
                element.parentNode.insertBefore (element.firstChild, element);
            }
            element.parentNode.removeChild (element);
        }

        function RemoveBold () {
            var boldTag = document.getElementById ("bold");
            if (boldTag) {
                RemoveElement (boldTag);
            }
        }
    </script>
</head>
<body>
    <b id="bold">
        Some text in bold
        <span style="color:red">Some red text in bold</span>
    </b>
    <br /><br />
    <button onclick="RemoveBold ();">Remove the bold style!</button>
</body>