当我们在同一个页面下导入多个库文件的时候可能会发生冲突以致于网页报错而不能运行。比如前段时间我就做一个网页特效的时候引入了jquery和觉其他的库,最后网页发送冲突报错运行不了,但我把jquery库文件删除后就能正常运行了。
平时我们在写jquery代码的时候都习惯用$,例如: $(function(){ $("div").show() })
如果没有用其他库这种写法是没问题的,如果用了其他库文件的话当其他库文件的全局对象也是$,问题就出来了。
下面是几种解决的方法:
一、用jQuery(callback)方法:
jQuery(function(){ jQuery("div").show() })也就是把$换成jQuery映射回原始的对象。需要注意的是这里的jQuery是区分大小写的。
二、用jQuery.noConflict()
注意:这个函数必须在你导入jQuery文件之后,并且在导入另一个导致冲突的库之前使用。当然也应当在其他冲突的库被使用之前,除非jQuery是最后一个导入的。
jQuery.noConflict()可以将变量$的控制权让渡给其他库,有几种用法:
jQuery.noConflict() //将变量$的控制权让渡给其他库 jQuery(function($){ $("div").show() //函数内可以继续使用$ })
var Q=jQuery.noConflict() //自定义一个Q快捷方式 jQuery(function($){ Q("div").show() //直接用Q快捷方式 })
以上几种方法基本能解决多库共存会发生冲突的问题了。不过我建议最好不要在一个页面你导入多个库文件。
平时我们在写jquery代码的时候都习惯用$,例如: $(function(){ $("div").show() })
如果没有用其他库这种写法是没问题的,如果用了其他库文件的话当其他库文件的全局对象也是$,问题就出来了。
下面是几种解决的方法:
一、用jQuery(callback)方法:
jQuery(function(){ jQuery("div").show() })也就是把$换成jQuery映射回原始的对象。需要注意的是这里的jQuery是区分大小写的。
二、用jQuery.noConflict()
注意:这个函数必须在你导入jQuery文件之后,并且在导入另一个导致冲突的库之前使用。当然也应当在其他冲突的库被使用之前,除非jQuery是最后一个导入的。
jQuery.noConflict()可以将变量$的控制权让渡给其他库,有几种用法:
jQuery.noConflict() //将变量$的控制权让渡给其他库 jQuery(function($){ $("div").show() //函数内可以继续使用$ })
var Q=jQuery.noConflict() //自定义一个Q快捷方式 jQuery(function($){ Q("div").show() //直接用Q快捷方式 })
以上几种方法基本能解决多库共存会发生冲突的问题了。不过我建议最好不要在一个页面你导入多个库文件。