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

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

mergeAttributes method

Browser support:

Copies all attributes and its values from the specified element to the current element.

Syntax:

object.mergeAttributes (source [, preserve]);

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

Parameters:

source

Required. Reference to the source element that contains the attributes to be copied.

preserve

Optional. Boolean that indicates whether the copying of the name and id attributes is forbidden or not.

One of the following values:

false

Copy the name and id attributes, too.

true

Default. Do not copy the name and id attributes.

Return value:

This method has no return value.

Example HTML code 1:

This example illustrates the use of the mergeAttributes method:

<head>
    <script type="text/javascript">
        function CopyAttrs () {
            var source = document.getElementById ("source");
            var destination = document.getElementById ("destination");
            if (document.body.mergeAttributes) {        // Internet Explorer
                destination.mergeAttributes (source, true);
            } else {        // Firefox, Google Chrome, Safari, Opera
                for (var i=0; i < source.attributes.length; i++) {
                    var attr = source.attributes[i];
                    var attrName = attr.name.toLowerCase ();
                    if (attrName != "id" && attrName != "name") {
                        destination.setAttribute (attr.name, attr.value);
                    }
                }
            }
        }
    </script>
</head>
<body>
    <div id="source" style="background-color:yellow">Source element</div>
    <br />
    <div id="destination" style="background-color:red">Destination element</div>
    <br /><br />
    <button onclick="CopyAttrs ();">Copy the attributes of the source element to the destination element!</button>
</body>