jQuery extend()方法

  • Post category:jquery

jQuery extend()方法用于将一个或多个对象的内容合并到目标对象中。本文将详细介绍extend()方法的语法用法,并提供两个示例说明。

语法

以下是extend()`方法的基本语法:

$.extend(target, object1 object2, ...)

在这个语法中,target是目对象,object1object2等是要合并到目标对象中的对象。extend()方法将返回合并后的目标对象。

示例1:使用extend()方法合并两个对象

以下是一个示例,演示如何使用extend()方法合并两个对象:

<!DOCTYPE html>
<html>
<head>
  <title>extend()方法示例</title>
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  <script>
    $(document).ready(function(){
      var object1 = {name: "张三", age: 20};
      var object2 = {gender: "男", address: "北京"};
      var target = {};
      $.extend(target, object1, object2);
      $("p").text(JSON.stringify(target));
    });
  </script>
</head>
<body>
  <p></p>
</body>
</html>

在这个示例,我们定义了两个对象object1object2,并将它们合并到一个空对象target中。然后,我们使用JSON.stringify()方法将合并后的目标对象转换为字符串,并将其显示在<p>元素中。

示例2:使用extend()方法合并多个对象

以下是另一个示例,演示如何使用extend()方法合并多个对象:

<!DOCTYPE html>
<html>
<head>
  <title>extend()方法示例</title>
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  <script>
    $(document).ready(function(){
      var object1 = {name: "张三", age: 20};
      var object2 = {gender: "男", address: "北京"};
      var object3 = {phone: "123456789", email: "zsan@example.com"};
      var target = {};
      $.extend(target, object1, object2, object3);
      $("p").text(JSON.stringify(target));
    });
  </script>
</head>
<body>
  <p></p>
</body>
</html>

在这个示例中,我们定义了三个对象object1object2object3,并将它们合并到一个空对象target。然后,我们使用JSON.stringify()方法将合后的目标对象转换为字符串,并将其显示在<p>元素中。

综上所述,extend()方法用于将一个或多个对象的内容合并到目标对象中。本文详细解了extend()方法的语法和用法,并提供了两个示例说明。