jQuery
jQuery

jQuery 其他方法

# jQuery 其他方法

# 1. jQuery 拷贝对象

作用：如果想要把某个对象拷贝（合并）给另一个对象使用，可以使用 $.extend() 方法。

语法：

$.extend([deep], target, object1, [objectN])

参数：
1. deep：布尔值，可选。如果设为 true，则为深拷贝；默认为 false，表示浅拷贝。
2. target：要拷贝的目标对象。
3. object1：待拷贝到第一个对象的对象。
4. objectN：待拷贝到第 N 个对象的对象。
解释：
- 浅拷贝：把被拷贝对象的复杂数据类型中的地址拷贝给目标对象，修改目标对象会影响被拷贝对象。
- 深拷贝：在前面加 true，表示完全克隆（拷贝的对象，而不是地址），修改目标对象不会影响被拷贝对象。

示例：

var obj1 = { a: 1, b: { c: 2 } };
var obj2 = { d: 3 };

// 浅拷贝
var shallowCopy = $.extend({}, obj1, obj2);
console.log(shallowCopy); // 输出：{ a: 1, b: { c: 2 }, d: 3 }

// 深拷贝
var deepCopy = $.extend(true, {}, obj1);
deepCopy.b.c = 4;
console.log(obj1.b.c); // 输出：2
console.log(deepCopy.b.c); // 输出：4

1
2
3
4
5
6
7
8
9
10
11
12

# 2. 多库共存

问题概述：
- jQuery 使用 $ 作为标识符，但随着 jQuery 的流行，其他 JS 库也会用 $ 作为标识符，这样一起使用会引起冲突。
客观需求：
- 需要一个解决方案，让 jQuery 和其他 JS 库不存在冲突，可以同时存在，这就叫做多库共存。
jQuery 解决方案：
1. 把代码中的 $ 符号统一改为 jQuery，如 jQuery('div')。
2. 使用 $.noConflict() 方法规定新的名称。
语法：
```
var newAlias = $.noConflict();
```
1

示例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>多库共存示例</title>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <script src="https://another-library.com/another-library.js"></script>
    <script type="text/javascript">
        // 防止 jQuery 与其他库的 $ 符号冲突
        var jq = $.noConflict();
        jq(document).ready(function() {
            jq("div").text("这是 jQuery 操作的结果");
        });

        // 其他库的代码可以继续使用 $ 符号
        $(document).ready(function() {
            $("div").css("color", "red");
        });
    </script>
</head>
<body>
    <div></div>
</body>
</html>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

上述使用 $.noConflict() 方法将 jQuery 的 $ 符号重新命名为 jq，防止与其他库的 $ 符号冲突。这样，jQuery 和其他库可以共存。

编辑此页

上次更新: 2024/12/28, 18:32:08

← jQuery 事件