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

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

swapNode method

Browser support:

Interchanges the positions of the current element and the specified element in the document hierarchy.

For a cross-browser solution, use the replaceChild, insertBefore and appendChild methods instead. See the example below.

Syntax:

object.swapNode (element);

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

Parameters:

element

Required. Reference to the element to swap with.

Return value:

Returns a reference to the current element.

Example HTML code 1:

This example illustrates the use of the swapNode method:

<head>
    <script type="text/javascript">
        function SwapWithFirst (button) {
            var container = document.getElementById ("container");
            var firstButton = container.getElementsByTagName ("button")[0];
            if (button != firstButton) {
                if (button.swapNode) {
                    button.swapNode (firstButton);
                }
                else {
                    var next = button.nextSibling;
                    container.replaceChild (button, firstButton);
                    container.insertBefore (firstButton, next);
                }
            }
        }
    </script>
</head>
<body>
    <div id="container">
        <button onclick="SwapWithFirst (this)" style="color:red">Swap me with the first</button>
        <button onclick="SwapWithFirst (this)" style="color:green">Swap me with the first</button>
        <button onclick="SwapWithFirst (this)" style="color:blue">Swap me with the first</button>
    </div>
</body>