Detailed introduction to the basic knowledge of noConflict() and detailed explanation of its usage in actual development-JS Tutorial-php.cn

Detailed introduction to the basic knowledge of noConflict() and detailed explanation of its usage in actual development

巴扎黑

Jun 20, 2017 pm 03:45 PM

introducebasic knowledgeactualdetailed

As you already know, jQuery uses the $ symbol as shorthand for jQuery.

What if other JavaScript frameworks also use the $ symbol as a shorthand?

Some other JavaScript frameworks include: MooTools, Backbone, Sammy, Cappuccino, Knockout, JavaScript MVC, Google Web Toolkit, Google Closure, Ember, Batman, and Ext JS.

Some of these frameworks also use the $ symbol as a shorthand (just like jQuery). If you are using two different frameworks that are using the same shorthand symbol, it may cause the script to stop running.

The jQuery team took this issue into consideration and implemented the noConflict() method.

jQuery noConflict() method

The noConflict() method releases control of the $ identifier so that other scripts can use it.

Of course, you can still use jQuery by substituting the full name for the abbreviation:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$.noConflict();
jQuery(document).ready(function(){
  jQuery("button").click(function(){
    jQuery("p").text("jQuery 仍然在工作!");
  });
});
</script>
</head>
<body>
<p>这是一个段落。</p>
<button>点我</button>
</body>
</html>

You can also create your own abbreviation. noConflict() returns a reference to jQuery that you can store in a variable for later use. Take a look at this example:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
var jq=$.noConflict();
jq(document).ready(function(){
  jq("button").click(function(){
    jq("p").text("jQuery 仍然在工作!");
  });
});
</script>
</head>
<body>
<p>这是一个段落。</p>
<button>点我</button>
</body>
</html>

If your jQuery code block uses the $ abbreviation, and you don't want to change this shortcut, you can pass the $ symbol as a variable to the ready method. In this way, you can use the $ symbol inside the function - but outside the function, you still have to use "jQuery":

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
$.noConflict();
jQuery(document).ready(function($){
  $("button").click(function(){
    $("p").text("jQuery 仍然在工作!");
  });
});
</script>
</head>
<body>
<p>这是一个段落。</p>
<button>点我</button>
</body>
</html>

In actual development:

Running this function will take control of the variable $ Yield to the first library to implement it.

This helps ensure that jQuery does not conflict with other libraries' $objects.

<script type="text/javascript" src="/javascripts/jquery.js"></script>
  　　<script type="text/javascript">
  　　　　 var j$ = $;
   　　　　jQuery.noConflict();
  　　</script>
<script type="text/javascript" src="/javascripts/prototype.js" ></script>

After running this function, you can only access the jQuery object using jQuery variables. For example, where $("div p") is used, it must be replaced by j$("div p").

Note: This function must be used after you import the jQuery file, and before importing another library that causes conflicts. Of course it should also be done before other conflicting libraries are used, unless jQuery is the last one imported.

Usage method 1:

jQuery.noConflict();
// 使用 jQuery
j$("div p").hide(); 
// 使用其他库的 $() 
$("content").style.display = &#39;none&#39;;

Usage method 2:

//我的一个站点 viqiwu.com
var viqiwu = jQuery.noConflict();
// 基于 jQuery 的代码
viqiwu("div p").hide(); 
// 基于其他库的 $() 代码 
$("content").style.display = &#39;none&#39;;

This way you don’t have to worry about conflicts between JQuery and other JS frameworks .

The above is the detailed content of Detailed introduction to the basic knowledge of noConflict() and detailed explanation of its usage in actual development. For more information, please follow other related articles on the PHP Chinese website!

Statement

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Python函数介绍：exec函数的介绍及示例Nov 03, 2023 pm 02:09 PM

Python函数介绍：exec函数的介绍及示例引言：在Python中，exec是一种内置函数，它用于执行存储在字符串或文件中的Python代码。exec函数提供了一种动态执行代码的方式，使得程序可以在运行时根据需要生成、修改和执行代码。本文将介绍exec函数的使用方法，并给出一些实际的代码示例。exec函数的使用方法：exec函数的基本语法如下所示：exec

i5处理器是否能装win11详细介绍Dec 27, 2023 pm 05:03 PM

i5是英特尔旗下的一系列处理器，拥有到现在11代i5的各种不同版本，每一代都有着不同性能。因此对于i5处理器是否能够安装win11，还需要看是第几代的处理器，下面就跟着小编一起来分别了解一下吧。i5处理器能装win11吗：答：i5处理器能装win11。一、第八代及之后的i51、第八代及后续的i5处理器是能够满足微软的最低配置需求的。2、因此我们只需要进入微软网站，下载一个“win11安装助手”3、下载完成后，运行该安装助手，根据提示进行操作就可以安装win11了。二、第八代之前的i51、第八代之

edge快捷键的介绍Jul 12, 2023 pm 05:57 PM

在如今快捷的生活，为了提高工作效率，快捷键是必不可少的工作需求。快捷键是指按键或按键组合，可提供另一种方式来执行通常使用鼠标执行的操作。那么edge快捷键有哪些呢？edge快捷键的功能又有哪些呢？下面小编整理了一份edge快捷键的介绍，感兴趣的朋友们快来看看吧！Ctrl+D：将当前页面添加到收藏夹或阅读列表Ctrl+E：在地址栏中执行搜索查询Ctrl+F：在页面上查找Ctrl+H：打开历史记录面板Ctrl+G：打开阅读列表面板Ctrl+I：打开收藏夹列表面板(测试好像不起作用)Ctrl+J：打开

PHP函数介绍：strtr()函数Nov 03, 2023 pm 12:15 PM

PHP函数介绍：strtr()函数在PHP编程中，strtr()函数是一个非常有用的字符串替换函数。它用于将字符串中的指定字符或字符串替换为其他字符或字符串。本文将介绍strtr()函数的用法，并给出一些具体的代码示例。strtr()函数的基本语法如下：strtr(string$str,array$replace)其中，$str是要进行替换操作的原始字

Java语言中的数学模型介绍Jun 10, 2023 am 11:57 AM

Java语言是一种高级编程语言，非常适合用于数学模型的构建和分析。数学模型是数学概念在现实世界中的应用，它们通常用于解决实际问题，例如预测未来趋势、优化生产和制造等。本文将介绍Java语言中常见的数学模型及其应用。线性规划线性规划是一种优化方法，在解决企业最优决策、资源配置以及生产计划等问题中广泛应用。在Java语言中，可以使用ApacheCommons

Python函数介绍：zip函数的介绍及示例Nov 03, 2023 pm 02:02 PM

Python函数介绍：zip函数的介绍及示例Python是一种高级语言，它提供了许多有用的函数来帮助开发人员快速地编写程序。其中一个函数就是zip函数。Zip函数是Python中的内置函数之一，它可以接受一组可迭代对象（包括列表、元组、集合和字典等），并返回一个由这些可迭代对象中的元素按顺序成对组成的元组。Zip函数可以用于多种情况，例如：1.将两个列表的元

windows7旗舰版激活方法介绍Jul 09, 2023 pm 08:05 PM

win7系统是微软经典的操作系统，其中win7旗舰版系统最为受欢迎，但是安装之后需要激活才能使用全部的功能。那么该如何激活win7系统呢？常见的方法就是win7激活工具或者密钥激活，下面小编就教下大家windows7旗舰版激活方法。我们以常用的win7激活工具，win7activation工具为例，具体的使用方法如下：1、首先在电脑上搜索并下载好win7activation工具软件包，解压后得到win7activation.exe的文件。鼠标右键点击exe文件，在弹出的菜单栏中点击以管理员身份运

PHP array_column()函数使用方法介绍Jun 27, 2023 pm 12:05 PM

在PHP中，数组是一种非常常见的数据类型，它可以存储一组值。而在我们使用数组时，有时候会需要取出其中某个键对应的值。这个时候，我们就可以使用PHP中的array_column()函数来从数组中获取指定键的值。本文将从以下几个方面来介绍这个函数的使用方法：什么是array_column()函数array_column()函数的语法格式array_colum

See all articles