jQuery 라이브러리 충돌에 대해 수행할 작업
jQuery로 개발할 때 Prototype 등 다른 JS 라이브러리를 사용해도 되지만 여러 라이브러리가 공존할 경우 충돌이 발생할 수 있습니다. 이 글에서는 jQuery 라이브러리 충돌에 대한 완벽한 솔루션을 주로 소개합니다. 아래를 살펴보세요.
디자인을 요청하면 기본값인 $를 사용하고, 매개변수가 전달되지 않으면 $를 사용합니다. 마지막으로 매개변수를 전달할 때는 $를 사용합니다. 예를 들어 Enter jq를 입력하면 window.jq에 마운트됩니다.
var myControl="jq";
(function(name){
var $=name ||"$"; //name存在$的值就是name的值，不存在或为null，$的值为字符串"$"
console.log($);
window[$]=function(){
alert("123");
}
})(myControl)
window[myControl]();사실 이것은 충돌을 해결하는 jquery의 방식이 아닙니다. 그런 다음 jQuery가 충돌을 해결하는 방법을 살펴보세요.
jQuery의 여러 버전이나 다른 js 라이브러리와의 충돌은 주로 일반적으로 사용되는 $ 기호와 충돌합니다.
1. 충돌 해결
1. 동일한 페이지에서 여러 버전의 jQuery 간의 충돌을 해결하는 방법
<body>
<!-- 引入1.6.4版的jq -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.js"></script>
<script> var jq164 = jQuery.noConflict(true); </script>
<!-- 引入1.4.2版的jq -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.js"></script>
<script> var jq142 = jQuery.noConflict(true); </script>
<script>
(function($){
//此时的$是jQuery-1.6.4
$('#');
})(jq164);
</script>
<script>
jq142(function($){
//此时的$是jQuery-1.4.2
$('#');
});
</script>
</body>2. 다른 라이브러리 다음에 jQuery 라이브러리를 가져옵니다. $ 식별자이므로 다른 스크립트에서 사용할 수 있습니다.
<script src="prototype.js" type="text/javascript"></script>
<script src="jquery.js" type="text/javascript"></script>
<p id="pp">test---prototype</p>
<p>test---jQuery</p>
<script type="text/javascript">
jQuery.noConflict(); //将变量$的控制权让渡给prototype.js，全名可以不调用。
jQuery(function(){ //使用jQuery
jQuery("p").click(function(){
alert( jQuery(this).text() );
});
});
//此处不可以再写成$,此时的$代表prototype.js中定义的$符号。
$("pp").style.display = 'none'; //使用prototype
</script><script type="text/javascript">
var $j = jQuery.noConflict(); //自定义一个比较短快捷方式
$j(function(){ //使用jQuery
$j("p").click(function(){
alert( $j(this).text() );
});
});
$("pp").style.display = 'none'; //使用prototype
</script><script type="text/javascript">
jQuery.noConflict(); //将变量$的控制权让渡给prototype.js
jQuery(document).ready(function($){
$("p").click(function(){ //继续使用 $ 方法
alert( $(this).text() );
});
});
//或者如下
jQuery(function($){ //使用jQuery
$("p").click(function(){ //继续使用 $ 方法
alert( $(this).text() );
});
});
</script><script type="text/javascript">
jQuery.noConflict(); //将变量$的控制权让渡给prototype.js
(function($){ //定义匿名函数并设置形参为$
$(function(){ //匿名函数内部的$均为jQuery
$("p").click(function(){ //继续使用 $ 方法
alert($(this).text());
});
});
})(jQuery); //执行匿名函数且传递实参jQuery
$("pp").style.display = 'none'; //使用prototype
</script> jQuery 라이브러리는 기본적으로 $의 소유권에 속합니다. 그런 다음 "jQuery"를 직접 사용하여 일부 jQuery 작업을 수행할 수 있습니다.
<!-- 引入 jQuery -->
<script src="../../scripts/jquery.js" type="text/javascript"></script>
<!-- 引入 prototype -->
<script src="lib/prototype.js" type="text/javascript"></script>
<body>
<p id="pp">Test-prototype(将被隐藏)</p>
<p >Test-jQuery(将被绑定单击事件)</p>
<script type="text/javascript">
jQuery(function(){ //直接使用 jQuery ,没有必要调用"jQuery.noConflict()"函数。
jQuery("p").click(function(){
alert( jQuery(this).text() );
});
});
$("pp").style.display = 'none'; //使用prototype
</script>
</body>1. 소스 코드
소스 코드: 소스 코드에서 어떻게 이루어지는지 살펴보세요
var
// Map over jQuery in case of overwrite
_jQuery = window.jQuery,
// Map over the $ in case of overwrite
_$ = window.$,
jQuery.extend({
noConflict: function( deep ) {
if ( window.$ === jQuery ) {
window.$ = _$;
}
if ( deep && window.jQuery === jQuery ) {
window.jQuery = _jQuery;
}
return jQuery;
}
});//冲突
var $ = 123; //假设其他库中$为123
$(
function () {
console.log($); //报错Uncaught TypeError: $ is not a function
}
);충돌 해결
//解决冲突
var jq = $.noConflict();
var $ = 123;
jq(function () {
alert($); //123
});<script>
var $ = 123; // window.$是123，存储在私有的_$上。
</script>
<script src="https://code.jquery.com/jquery-2.2.4.js"></script>
<body>
<p>aaa</p>
<script>
var jq = $.noConflict();//当window.$===jQuery的时候，把_$赋给了window.$。
jq(function () {
alert($); //123
});
</script><script>
var $ = 123;
var jQuery=456;
</script>
<script src="https://code.jquery.com/jquery-2.0.3.js"></script>
<body>
<p>aaa</p>
<script>
var jq = $.noConflict();
jq(function () {
alert(jQuery); //构造函数
});
</script>
매개변수를 true로 쓰면 456이 뜹니다.
<script>
var $ = 123;
var jQuery=456;
</script>
<script src="https://code.jquery.com/jquery-2.0.3.js"></script>
<body>
<p>aaa</p>
<script>
var jq = $.noConflict(true); //写了true或者参数的时候，deep为真window.jQuery===jQuery为真，所以进入if条件。把456赋值给window.jQuery
jq(function () {
alert(jQuery); //456
});
</script>jquery.noConstrict()를 사용하여 jquery 라이브러리와 다른 라이브러리 간의 충돌 문제 해결
jQuery 라이브러리 다른 JS 라이브러리와 충돌합니다 Solution_jquery
위 내용은 jQuery 라이브러리 충돌에 대해 수행할 작업의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
핫 AI 도구
Undresser.AI Undress
사실적인 누드 사진을 만들기 위한 AI 기반 앱
AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.
Undress AI Tool
무료로 이미지를 벗다
Clothoff.io
AI 옷 제거제
Video Face Swap
완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!
인기 기사
뜨거운 도구
메모장++7.3.1
사용하기 쉬운 무료 코드 편집기
SublimeText3 중국어 버전
중국어 버전, 사용하기 매우 쉽습니다.
스튜디오 13.0.1 보내기
강력한 PHP 통합 개발 환경
드림위버 CS6
시각적 웹 개발 도구
SublimeText3 Mac 버전
신 수준의 코드 편집 소프트웨어(SublimeText3)
뜨거운 주제
7705
15
1640
14
1394
52
1288
25
1231
29
Ouyi 지갑 니모닉 문구를 잊어버린 경우 어떻게 해야 하나요? 아직도 찾을 수 있나요?
Jul 19, 2024 pm 12:13 PM
Web3 세계에서는 무료이지만 위험이 가득합니다. 따라서 Ouyi 지갑의 보안을 위한 첫 번째 단계는 개인 키와 니모닉 문구를 보호하는 것입니다. 개인 키의 중요성은 모두가 알고 있으며 오늘날 니모닉에 중점을 두고 있습니다. 니모닉 문구는 개인 키를 표현하는 또 다른 형태로 이해될 수 있습니다. 니모닉 문구를 갖는 것은 개인 키를 소유하고 지갑 자산을 제어하는 것과 같습니다. 또한 개인키에 비해 존재감이 낮아 사용자들이 Ouyi Wallet의 니모닉 문구를 잊어버릴 수도 있다고 생각됩니다. 그럼 Ouyi Wallet의 니모닉 문구를 잊어버린 경우 어떻게 해야 하나요? Ouyi 지갑 니모닉을 잊어버린 경우에도 검색할 수 있나요? 사용자가 주의해야 할 문제. 일반적으로 니모닉 문구를 잊어버리면 검색할 수 없으므로 관련 고객 서비스 담당자에게 도움을 요청하세요. 아래 에디터가 자세히 알려드리겠습니다. Ouyi 지갑 니모닉 문구를 잊어버린 경우 어떻게 해야 하나요? Ouyi Wallet의 니모닉 문구를 잊어버린 경우, 기억해내시거나 당사에 문의해 주시기 바랍니다.
광대역이 연결되어 있는데 인터넷에 접속할 수 없는 문제 해결(문제 해결)
May 05, 2024 pm 06:01 PM
오늘날의 정보화 시대에 인터넷은 사람들의 삶에 없어서는 안 될 부분이 되었습니다. 하지만 온라인에 접속할 수 없고 때로는 몇 가지 문제가 발생합니다. 그러나 예를 들어 광대역은 이미 연결되어 있습니다. 그리고 해당 해결 조치를 취하십시오. 이 경우 네트워크 연결을 복원하려면 문제를 단계별로 해결해야 합니다. 장치 연결 상태 확인: 휴대폰 및 기타 장치가 광대역 네트워크에 올바르게 연결되었는지 여부를 컴퓨터에서 확인하여 무선 네트워크 또는 유선 네트워크 연결이 정상적인지 확인하십시오. 2. 광대역 장치를 다시 시작합니다. 장치를 재설정하고 연결을 다시 설정한 후 몇 분 정도 기다렸다가 다시 켜십시오. 광대역 라우터나 모뎀을 꺼보세요. 3. 광대역 계정번호 및 비밀번호 확인: 잘못된 계정 또는 비밀번호로 인해 인터넷에 접속할 수 없는 상황을 방지하려면 광대역 계정번호와 비밀번호가 올바른지 확인하세요. 4. D를 확인하세요
TV에 눈송이가 나타날 경우 대처 방법(TV에 눈송이가 나타나는 문제를 해결하는 실용적인 방법)
Jun 01, 2024 pm 09:44 PM
일상 생활에서 중요한 엔터테인먼트 장치인 TV는 종종 눈보라로 인해 어려움을 겪으며 이는 시청 경험에 영향을 미칩니다. 이 기사에서는 TV 눈 문제를 해결하고 TV 프로그램을 더 잘 즐길 수 있는 실용적인 방법을 소개합니다. 1. 눈송이 문제의 원인 분석 TV에 나타나는 눈송이는 일반적으로 신호 간섭, 안테나 문제 또는 TV 신호 소스로 인해 발생합니다. 2. 안테나 연결이 느슨하지 않은지 확인하세요. 먼저 TV와 안테나의 연결이 느슨해졌는지 확인하세요. 3. 안테나의 위치와 방향이 올바른지 확인하기 위해 적합한 안테나를 선택하십시오. 성능이 좋은 안테나를 선택하면 신호 수신 품질이 향상될 수 있습니다. 4. 안테나 방향을 조정하세요. 안테나를 회전시키거나 각도를 조정하여 최적의 신호 수신 방향을 찾으세요. 5. 실내 안테나 신호를 사용하세요
jQuery에서 PUT 요청 방법을 사용하는 방법은 무엇입니까?
Feb 28, 2024 pm 03:12 PM
jQuery에서 PUT 요청 방법을 사용하는 방법은 무엇입니까? jQuery에서 PUT 요청을 보내는 방법은 다른 유형의 요청을 보내는 것과 유사하지만 몇 가지 세부 사항과 매개 변수 설정에 주의해야 합니다. PUT 요청은 일반적으로 데이터베이스의 데이터 업데이트 또는 서버의 파일 업데이트와 같은 리소스를 업데이트하는 데 사용됩니다. 다음은 jQuery에서 PUT 요청 메소드를 사용하는 구체적인 코드 예제입니다. 먼저 jQuery 라이브러리 파일을 포함했는지 확인한 다음 $.ajax({u를 통해 PUT 요청을 보낼 수 있습니다.
TV 재생 시 바스락거리는 소리 해결 방법(TV 바스락거리는 소리 제거)
Jul 21, 2024 pm 03:29 PM
기술의 발전과 고화질 화질에 대한 사람들의 요구가 증가함에 따라 TV는 홈 엔터테인먼트에서 없어서는 안 될 부분이 되었습니다. 그러나 때로는 TV를 시청하는 동안 거슬리는 바스락거리는 소리가 들리는 경우가 있는데, 이는 시청 경험에 영향을 미칠 뿐만 아니라 TV 오작동을 일으킬 수도 있습니다. 이 기사에서는 TV 재생 중 바스락거리는 소리를 해결하여 더 높은 품질의 영화 시청 경험을 즐길 수 있는 몇 가지 방법을 소개합니다. 1: 오디오 케이블 연결이 느슨한지 확인하세요. TV 재생 시 바스락거리는 소리가 나는 경우 먼저 오디오 케이블 연결이 제대로 되어 있는지 확인하세요. 오디오 케이블의 양쪽 끝이 올바른 커넥터에 연결되어 있는지 확인하고 연결이 느슨하거나 연결 상태가 좋지 않은지 확인하십시오. 2: TV 볼륨 및 오디오 장치 설정을 조정합니다. TV 볼륨 및 오디오 장치 설정을 적절하게 조정하면 바스락거리는 소리를 제거하는 데 도움이 됩니다. 노력하다
jQuery 팁: 페이지에 있는 모든 태그의 텍스트를 빠르게 수정하세요.
Feb 28, 2024 pm 09:06 PM
제목: jQuery 팁: 페이지에 있는 모든 태그의 텍스트를 빠르게 수정하세요. 웹 개발에서는 페이지의 요소를 수정하고 조작해야 하는 경우가 많습니다. jQuery를 사용할 때 페이지에 있는 모든 태그의 텍스트 내용을 한 번에 수정해야 하는 경우가 있는데, 이는 시간과 에너지를 절약할 수 있습니다. 다음은 jQuery를 사용하여 페이지의 모든 태그 텍스트를 빠르게 수정하는 방법을 소개하고 구체적인 코드 예제를 제공합니다. 먼저 jQuery 라이브러리 파일을 도입하고 다음 코드가 페이지에 도입되었는지 확인해야 합니다. <
jQuery를 사용하여 모든 태그의 텍스트 내용 수정
Feb 28, 2024 pm 05:42 PM
제목: jQuery를 사용하여 모든 태그의 텍스트 내용을 수정합니다. jQuery는 DOM 작업을 처리하는 데 널리 사용되는 인기 있는 JavaScript 라이브러리입니다. 웹 개발을 하다 보면 페이지에 있는 링크 태그(태그)의 텍스트 내용을 수정해야 하는 경우가 종종 있습니다. 이 기사에서는 jQuery를 사용하여 이 목표를 달성하는 방법을 설명하고 구체적인 코드 예제를 제공합니다. 먼저 페이지에 jQuery 라이브러리를 도입해야 합니다. HTML 파일에 다음 코드를 추가합니다.
컴퓨터에 블루투스가 안되는데 해결방법(블루투스 기능을 빠르게 추가하는 방법 및 주의사항)
Jun 29, 2024 pm 06:57 PM
현대사회에서 블루투스는 우리 일상생활에 없어서는 안 될 기술로 자리 잡았습니다. 그러나 일부 구형 컴퓨터의 경우 Bluetooth 기능이 내장되어 있지 않을 수 있습니다. 컴퓨터에 Bluetooth가 없고 Bluetooth 장치를 사용하고 싶다면 어떻게 해야 합니까? 이 문서에서는 Bluetooth 기능을 빠르게 추가하기 위한 몇 가지 방법과 주의 사항을 소개합니다. 1. 블루투스 어댑터 사용 - 블루투스 어댑터는 USB 인터페이스를 통해 컴퓨터에 연결할 수 있는 외부 장치입니다. -호환되는 Bluetooth 어댑터를 구입하고 지침에 따라 드라이버를 설치하십시오. - Bluetooth 어댑터를 컴퓨터의 USB 포트에 연결하고 시스템이 자동으로 드라이버를 설치할 때까지 기다립니다. 2. 드라이버 확인 1. 컴퓨터에 블루투스 장치가 있는지 확인하세요. 장치 관리자를 열고 블루투스 장치가 있는지 확인하세요. 그렇지 않다면
