学习jQuery中的noConflict()用法

noConflict()

jQuery使用$符号，作为jQuery的简写

JavaScript框架包括：MooTools、Backbone、Sammy、Cappuccino、Knockout、JavaScriptMVC、GoogleWebToolkit、GoogleClosure、Ember、Batman以及ExtJS等等

其中一些框架也使用$符号作为简写

如果，用的两种不同的框架，使用相同的简写符号，可能导致脚本停止运行

为此，jQuery提供了noConflict()方法

释放标识符

会释放对$标识符的控制

这样，其他脚本就可以使用了

$.noConflict();

全名代替

使用jQuery全名，代替简写$

jQuery(document).ready(function(){
 jQuery("button").click(function(){
  jQuery("p").text("jQuery 仍然在工作!");
 });
});

创建简写

可以创建自己的简写

noConflict()可以返回对jQuery的引用

把它存入一个变量，之后，使用这个变量，代替$

var jq = $.noConflict();
jq(document).ready(function(){
 jq("button").click(function(){
  jq("p").text("jQuery 仍然在工作!");
 });
});

参数传递

可以把$符号作为变量，传递给ready方法

这样，可以在函数内使用$符号，在函数外，不能使用$

$.noConflict();
jQuery(document).ready(function($){
 $("button").click(function(){
  $("p").text("jQuery 仍然在工作!");
 });
});
赞 (0)

相关推荐

  • 三分钟带你玩转jQuery.noConflict()

    jQuery是目前使用最广泛的前端框架之一,有大量的第三方库和插件基于它开发.为了避免全局命名空间污染,jQuery提供了jQuery.noConflict()方法解决变量冲突.这个方法,毫无疑问,非常有效.遗憾的是,jQuery的官方文档对该方法的描述不够清晰,许多开发者并不清楚当他们调用jQuery.noConflict()时,究竟发生了什么,从而导致在使用时出现了许多问题.尽管如此,jQuery.noConflict()背后实现原理依然值得Web开发者学习掌握,成为解决类似全局命名空间污染

  • 轻松搞定jQuery.noConflict()

    jQuery是目前使用最广泛的前端框架之一,有大量的第三方库和插件基于它开发.为了避免全局命名空间污染,jQuery提供了jQuery.noConflict()方法解决变量冲突.这个方法,毫无疑问,非常有效.遗憾的是,jQuery的官方文档对该方法的描述不够清晰,许多开发者并不清楚当他们调用jQuery.noConflict()时,究竟发生了什么,从而导致在使用时出现了许多问题.尽管如此,jQuery.noConflict()背后实现原理依然值得Web开发者学习掌握,成为解决类似全局命名空间污染

  • jQuery中noConflict()用法实例分析

    本文实例讲述了jQuery中noConflict()用法.分享给大家供大家参考.具体分析如下: jQuery默认使用"$"操作符,$ 符号只是 window.jQuery 对象的一个引用,jQuery.noConflict() ,这个函数将变量$的控制权让渡给第一个实现它的那个库.这有助于确保jQuery不会与其他库的$对象发生冲突.在运行这个函数后,就只能使用jQuery变量访问jQuery对象.例如,在要用到$("div p")的地方,就必须换成jQuery(&

  • 避免jQuery名字冲突 noConflict()方法

    众所周知,在jQuery语法中,$符号是jQuery的简写方式.但在某些情况下,可能需要在同一个页面引入其他javascript库(比如Prototype).因为$简短方便,很多的库也是使用$符号.为了避免名称冲突,jQuery提供了noConflict()方法来解决这个问题.调用该方法可以把对$标识符的控制权让给其他库. 一般模式: <script src="prototype.js"></script>//1.包含jQuery之外的库(比如Prototype

  • jQuery中 noConflict() 方法使用

    jQuery 和其他 JavaScript 框架正如您已经了解到的,jQuery 使用 $ 符号作为 jQuery 的简写. 如果其他 JavaScript 框架也使用 $ 符号作为简写怎么办? 其他一些 JavaScript 框架包括:MooTools.Backbone.Sammy.Cappuccino.Knockout.JavaScript MVC.Google Web Toolkit.Google Closure.Ember.Batman 以及 Ext JS. 其中某些框架也使用 $ 符号

  • 学习jQuery中的noConflict()用法

    noConflict() jQuery使用$符号,作为jQuery的简写 JavaScript框架包括:MooTools.Backbone.Sammy.Cappuccino.Knockout.JavaScriptMVC.GoogleWebToolkit.GoogleClosure.Ember.Batman以及ExtJS等等 其中一些框架也使用$符号作为简写 如果,用的两种不同的框架,使用相同的简写符号,可能导致脚本停止运行 为此,jQuery提供了noConflict()方法 释放标识符 会释放

  • jQuery中innerHeight()方法用法实例

    本文实例讲述了jQuery中innerHeight()方法用法.分享给大家供大家参考.具体分析如下: 获取第一个匹配元素内部区域高度. 包括内补白(padding).不包括边框border). 也就是说内部区域的宽度等于width和padding之和. 此方法对可见和隐藏元素均有效. 可以结合innerWidth()方法学习. 语法结构: 复制代码 代码如下: $(selector).innerHeight() 实例代码: 复制代码 代码如下: <!DOCTYPE html> <html

  • jQuery中html()方法用法实例

    本文实例讲述了jQuery中html()方法用法.分享给大家供大家参考.具体分析如下: 此方法能够设置和取得匹配元素的HTML内容,原来的内容将会被新设置的内容替换. 特别说明: HTML内容就是内容中可以包含HTML标签,并且能够被浏览器渲染. 文本内容是先将内容中的HTML预定义字符转换成html字符实体,这样HTML标签就不会被渲染. 语法结构一: 复制代码 代码如下: $(selector).html() 此时方法不带参数时候是取得第一个匹配元素的html内容. 此方法与text()方法

  • jQuery中outerWidth()方法用法实例

    本文实例讲述了jQuery中outerWidth()方法用法.分享给大家供大家参考.具体分析如下: 此方法获取第一个匹配元素外部宽度. 默认情况下外部高度是宽度(width).内补白(padding)和边框(border)之和. 如果参数设置为true的话,外补白(margin)尺寸也会算入外部宽度. 此方法对可见和隐藏元素均有效. 可以与outerHeight()方法结合学习. 语法结构: 复制代码 代码如下: $(selector).outerWidth(options) 参数列表: 参数

  • jQuery中outerHeight()方法用法实例

    本文实例讲述了jQuery中outerHeight()方法用法.分享给大家供大家参考.具体分析如下: 此方法获取第一个匹配元素外部高度. 默认情况下外部高度是高度(height).内补白(padding)和边框(border)之和. 如果参数设置为true的话,外补白(margin)尺寸也会算入外部宽度. 此方法对可见和隐藏元素均有效. 可以与outerWidth()方法结合学习. 语法结构: 复制代码 代码如下: $(selector).outerHeight(options) 参数列表: 参

  • jQuery中innerWidth()方法用法实例

    本文实例讲述了jQuery中innerWidth()方法用法.分享给大家供大家参考.具体分析如下: 获取第一个匹配元素内部区域宽度. 包括内补白(padding).不包括边框border).也就是说内部区域的宽度等于padding和border之和. 此方法对可见和隐藏元素均有效. 可以结合innerHeight()方法学习. 语法结构: 复制代码 代码如下: $(selector).innerWidth() 实例代码: 复制代码 代码如下: <!DOCTYPE html> <html&

  • jQuery中dequeue()方法用法实例

    本文实例讲述了jQuery中dequeue()方法用法.分享给大家供大家参考.具体分析如下: 此函数能够从队列最前端移除一个队列函数,并执行它. 建议和queue()函数一起学习. 语法结构: 复制代码 代码如下: $(selector).dequeue(queueName) 参数列表: 参数 描述 queueName 可选.队列的名称. 默认是 "fx",动画队列. 实例代码: 复制代码 代码如下: <!DOCTYPE html> <html> <hea

  • jQuery中before()方法用法实例

    本文实例讲述了jQuery中before()方法用法.分享给大家供大家参考.具体分析如下: 此方法可向每个匹配元素的外部的前部追加HTML内容. 特别说明: 此方法是追加内容,也就是原来的内容还在. HTML内容就是内容中可以包含HTML标签,并且能够被浏览器渲染. 文本内容是先将内容中的HTML预定义字符转换成html字符实体,这样HTML标签就不会被渲染. 语法结构: 复制代码 代码如下: $(selector).before(content) 实例代码: 实例一: 复制代码 代码如下: <

  • jQuery中prepend()方法用法实例

    本文实例讲述了jQuery中prepend()方法用法.分享给大家供大家参考.具体分析如下: 此方法可向所有匹配元素的内部的前面追加HTML内容. 特别说明: 此方法是追加内容,也就是原来的内容还在. HTML内容就是内容中可以包含HTML标签,并且能够被浏览器渲染. 文本内容是先将内容中的html预定义字符转换成html字符实体,这样html标签就不会被渲染. 语法结构: 复制代码 代码如下: $(selector).prepend(content) 实例代码: 实例一: 复制代码 代码如下:

  • jQuery中queue()方法用法实例

    本文实例讲述了jQuery中queue()方法用法.分享给大家供大家参考.具体分析如下: 此方法能够显示或者操作在匹配元素上执行的函数队列. 此方法可能用的并不是太频繁,但是却非常的重要,下面就结合实例来介绍一下次方法的用法. 根据方法参数的不同,作用也有所不同. 说明:建议结合dequeue()函数一起学习. 语法结构一: 复制代码 代码如下: $("selector").queue(queueName) 参数列表: 参数 描述 queueName 可选. 第一个匹配元素上动画队列的

随机推荐