jQuery Misc
다른 자바스크립트 프레임워크와 충돌방지
jQuery - The noConflict() Method
jQuery and Other JavaScript Frameworks
- 앵글러js,백본js,엠버js 등등 사용할때
$표시를 사용하면 j-query 충돌함
The jQuery noConflict() Method
- js프레임워크 충돌방지
Ex1)
<script>
$.noConflict();
jQuery(document).ready(function(){ // 기존 $ 표시 대신 현재 jQueury
jQuery("button").click(function(){ // 기존 $ 표시 대신 현재 jQueury
jQuery("p").text("jQuery is still working!"); // 기존 $ 표시 대신 현재 jQueury
});
});
</script>
</head>
<body>
<p>This is a paragraph.</p>
<button>Test jQuery</button>
</body>
</html>
Ex2) - 다른 방법 - 변수로 지정해서 사용
<script>
var jq = $.noConflict(); // 기존 $에서 현재 변수명 jq = $.noConflict(); 사용
jq(document).ready(function(){ // 변수 jq
jq("button").click(function(){ // 변수 jq
jq("p").text("jQuery is still working!"); // 변서 jq
});
});
</script>
</head>
<body>
<p>This is a paragraph.</p>
<button>Test jQuery</button>
</body>
</html>
Ex3) - 다른 방법 - 함수 안에서 사용하면됨
<script>
$.noConflict(); // $.noConflict(); 지정을 하고
jQuery(document).ready(function($){ // .ready 메소드에 파라미터 ($) 넘겨줌
$("button").click(function(){
$("p").text("jQuery is still working!");
});
});
</script>
</head>
<body>
<p>This is a paragraph.</p>
<button>Test jQuery</button>
</body>
</html>
'Front-End > J-Query' 카테고리의 다른 글
| Jquery 기본 문법 (0) | 2017.10.23 |
|---|---|
| w3schools - templates (0) | 2017.07.06 |
| jQuery AJAX (0) | 2017.07.06 |
| jQuery Traversing (0) | 2017.07.06 |
| jquery HTML (0) | 2017.07.06 |
