如何成为一个jQuery no.conflict专家?

Jit*_*yas 3 javascript jquery

如何成为一个jQuery no.conflict专家?

我主要面对Prototypes JS的jQuery冲突错误.而且我不是jquery专家.

我还能解决所有冲突问题吗?如何专业化解决冲突问题.

如何知道整个代码是jquery.如果简单的javascript和jquery代码混合在一个js文件中怎么办?

如果内部外部js代码直接从内部开始怎么办?

       var opbox="";
Run Code Online (Sandbox Code Playgroud)

这是我无法改变的源订单

1

<script type="text/javascript" src="jquery.min.js"></script> 
Run Code Online (Sandbox Code Playgroud)

2
我想从example.js中删除冲突错误

<script type="text/javascript" src="example.js"></script>
Run Code Online (Sandbox Code Playgroud)

3

<script type="text/javascript" src="Prototype.js"></script>
Run Code Online (Sandbox Code Playgroud)

4

<script type="text/javascript" src="scriptaculous.js ></script>
Run Code Online (Sandbox Code Playgroud)

T.J*_*der 9

问题是,如果你想在页面上使用Prototype,那么$必须是Prototype $,而不是jQuery.因为无论如何$只是一个别名jQuery,jQuery提供了一个noConflict函数,作为告诉jQuery $在jQuery加载之前将控制权返回给它的任何东西.

这意味着无论何时使用$,您都可以使用jQuery,例如:

$('.foo').hide(); // Hide all elements with class "foo"
Run Code Online (Sandbox Code Playgroud)

jQuery('.foo').hide(); // Hide all elements with class "foo"
Run Code Online (Sandbox Code Playgroud)

如果您正在使用外部脚本,并且如果它们使用$,则必须对其进行修改.一种方法是进行搜索和替换,只需将所有(适当的)更改$jQuery.

另一种方法是将它放在包含jQuery的脚本标记之后:

<script type='text/javascript'>jQuery.noConflict();</script>
Run Code Online (Sandbox Code Playgroud)

...然后将其添加到外部脚本的顶部:

(function($) {
Run Code Online (Sandbox Code Playgroud)

......这就在它的底部:

})(jQuery);
Run Code Online (Sandbox Code Playgroud)

(是的,这意味着您必须修改外部脚本.)

这样做是将整个外部脚本放在一个函数中,在该函数中$符号被解析为jQuery而不是Prototype $,因为它$是该函数的参数,因此它优先.但是,该技术将失败一些脚本.如果他们期望他们的函数声明将在全局范围内发生(例如,成为window对象的属性),那么将整个脚本放在一个函数中就会破坏它.在这些情况下,您必须通过将这些功能分配给上面window的全局搜索和替换选项来手动导出这些功能.

jQuery noConflict页面上有这样的例子,尽管它们经常将上面的内容与ready函数结合起来,这可能有点令人困惑.

请注意bobince关于框架之间冲突的观点,而不仅仅局限于$符号.如果您可能只使用一个框架,那就这样做吧.


Jus*_*ner 5

使用jQuery功能时$,不要使用快捷方式,而是调用jQuery.noConflict()并使用全长jQuery()对象.

例如:

<script>
    $(document).ready(function(){
        // Do some DOM manipulation here
    });
</scipt>
Run Code Online (Sandbox Code Playgroud)

会成为:

<script>
   jQuery.noConflict();

   jQuery(document).ready(function(){
       // Do some DOM manipulation here
   });
</script>
Run Code Online (Sandbox Code Playgroud)