jQuery extend() Method

You are Here:

jQuery extend() Method

The jQuery extend() method merges the contents of two or more objects together into the first object.

Note: The merge performed by extend() method is not recursive by default; if a property of the first object is itself an object or array, it will be completely overwritten by a property with the same key in the second or subsequent object.

Example

HTML Editor
<!DOCTYPE html> <html lang="en-US"> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> </head> <body> <h1>jQuery extend() Method</h1> <p>Click on the button and check your console.</p> <button>Click Me</button> <script> $(document).ready(function(){ $("button").click(function(){ var a = {foo: 1, bar: 1}; var b = {foo: 2, koo: 2}; var c = {koo: 3, yaa: 3} var r = $.extend(a, b, c); console.log(a); console.log(b); console.log(c); console.log(r); console.log(a === r); }); }); </script> </body> </html>

Syntax

$.extend(targetObj, obj1, ..., objN);

Parameter Values

ValueTypeExplanation
targetObjRequiredSpecifies an object that will receive the new properties if additional objects are passed in or that will extend the jQuery namespace if it is the sole argument.
obj1, ..., objNOptionalSpecifies objects containing additional properties to merge in.

Reminder

Hi Developers, we almost covered 99.5% of jQuery Tutorials with examples for quick and easy learning.

We are working to cover every Single Concept in jQuery.

Please do google search for:

Join Our Channel

Join our telegram channel to get an instant update on depreciation and new features on HTML, CSS, JavaScript, jQuery, Node.js, PHP and Python.

This channel is primarily useful for Full Stack Web Developer.

Share this Page

Meet the Author