jQuery多库冲突问题，总结附带代码，一看就懂

最新推荐文章于 2020-07-20 09:33:19 发布

tztz1yzyz2

最新推荐文章于 2020-07-20 09:33:19 发布

阅读量460

点赞数

分类专栏： js css 文章标签： jQuery 冲突问题多库并存

本文链接：https://blog.csdn.net/tztz1yzyz2/article/details/78456770

版权

js 同时被 2 个专栏收录

6 篇文章 0 订阅

订阅专栏

css

5 篇文章 0 订阅

订阅专栏

jQuery

在引入多个js框架后，怎样解决$冲突问题？（conflict）

Jquery和其他js库一起引入，谁写在后面$定义谁；要想并存有如下四种解决方案：

方法1：使用JQuery.noConflict()：放弃对$的使用权，$用自己的全称（jquery）替换。

方法2：自定义JQuery的别名：var $j = jquery noconflict()。

方法3：使用语句块，在语句块中仍然使用jquery.js中定义的$：

       JQuery(document).ready(function($){
       $('#msg').hide()});

      //此时在整个ready事件的方法中使用的$都是jquery.js中定义的$

方法4：(function($){
       .....
       $('#msg').hide()})(JQuery)

       //此时在这个语句块中使用的都是jquery.js中定义的$.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<p id="p">tz</p>
</body>
<script src="../../jQuery2/protool.js"></script>
<script src="../../jQuery2/jquery-3.1.1.js"></script>

<script>
   // 方法1：
    jQuery.noConflict();
    jQuery("#p").hide();

    /*方法2：*/
    var $j = jQuery.noConflict();
    $j("#p").hide();

    /*方法3:*/
    jQuery(document).ready(function($){
        $("p").hide();
    });

    /*方法3：*/
    (function($){
        $("#p").hide();
    })(jQuery);
</script>

</html>

tztz1yzyz2

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jQuery多库冲突问题，总结附带代码，一看就懂

jQuery1. 在引入多个js框架后，怎样解决$冲突问题？（conflict）Jquery和其他js库一起引入，谁写在后面$定义谁；要想并存有如下四种解决方案：方法1：使用JQuery.noConflict()：放弃对$的使用权，$用自己的全称（jquery）替换。方法2：自定义JQuery的别名：var $j = jquery noconflict()。方法3：
复制链接

扫一扫