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.


object.swapNode (element);
You can find the related objects in the Supported by objects section below.


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:
    <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);
    <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>
Did you find this example helpful? yes no

Supported by objects:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content