CMS의 모든 페이지에서 사용되는 jQuery의 글로벌 컨텍스트 피하기

나는 독점 CMS를 매일 사용하며 개별 사이트를 사용자 정의하는 가장 쉬운 방법 중 하나는 모든 페이지에있는 theme.js를 사용하는 것입니다. 기본 접근 방식은 대개 jQuery이지만 바닐라 자바 스크립트도 권장됩니다. 어떤면에서는 Wordpress의 함수 파일처럼 생각하십시오. 완벽한 솔루션이 아니며 새로운 기능을 추가하기 만하면됩니다.CMS의 모든 페이지에서 사용되는 jQuery의 글로벌 컨텍스트 피하기

불필요하지만 페이지가로드 될 때 작동하는 격리 된 기능을 추가 할 때 표준을 준수하고 버그가 적게 발생하는 방법으로 추가하려고합니다. 내가 피하기를 바라는 한 가지는 뻔뻔스러운 글로벌 컨텍스트 (들)입니다.

내가 처음 그것을 할 것으로 나타났다 방법

예 :

$(function() { 

    $('div.target').append('<p>New stuff</p>'); 

});

우리는 그것을 통해 이야기하고 캡슐화하기로 합의했다 :

(function() { 
    var foo; 
    if (bar) { 
     // some code 
    } 
}());

문제는, 내가 코드를 실행할 때 그것과 똑같아 효과가 없습니다. 작동

(function($) { 

    $(document).ready(function() { 

     $('div.target').append('<p>New stuff</p>'); 

    }); 

}(jQuery));

을,하지만 난 그게 목적을 패배하지 않으 : 그래서, 나는이로 변경되었습니다. $(document).ready(function()을 추가하여 작은 기능으로 글로벌 컨텍스트를 캡슐화하고 피하는 노력을 기울이고 있습니까?

출처

2014-12-02 user1729506

'document.ready'를 원하지 않으면 닫는'' 태그 바로 앞의 코드를 이동하십시오. 그러나 솔직히, 나는 당신의 질문을 이해하지 못한다. 무엇을 성취하려고 노력하고 있으며, 왜 똑같은 일을하지 않을 때 첫 번째 질문에서 두 번째 질문으로 바꾸 었는가? –

첫 번째'document.ready()'*의 코드는 전역 컨텍스트를 오염시키지 않습니다 *. 그것은 다른 시도와 마찬가지로 함수 내부에 있습니다. – haim770

@ Karl-AndréGagnon - 페이지에서 theme.js 파일 호출을 이동할 수 없습니다. 이것이 CMS의 일부입니다. 동적으로 생성됩니다. 해당 파일 내에서만 코드를 추가하고 제거 할 수 있습니다. – user1729506

$(function() {은 $(document).ready(function() {의 바로 가기입니다. 두 경우 모두 함수 안에 있으므로 변수를 할당 할 때 var을 사용하면 전역 범위를 오염시키지 않습니다.

아무런 문제없이 ready 핸들러를 여러 개 사용할 수 있습니다.

출처

2014-12-02 16:07:51

는 따라서 사용하는 것이 안전 할 것이다 : '(함수 ($) { $ (문서) .ready (함수() { $ target.append ('

새로운 텍스트

'); }); } (jQuery를));' 또는 법한 '(함수 ($) { VAR doSomeStuff = 함수() { var에 $ 대상 = $ ('div.target'); 경우 ($ target.get (0)) { $ target.append ('

새 텍스트

'); } }; $ (document) .ready (function() { doSomeStuff(); }); } (jQuery)); 더 좋습니까? 아니면 후자가 과잉인가? – user1729506

사과. 나는 주석에있는 코드가 한 줄로 강요 당할 것이라는 것을 깨닫지 못했다. 여기 : http://jsfiddle.net/hfmnnzaz/ – user1729506

CMS의 모든 페이지에서 사용되는 jQuery의 글로벌 컨텍스트 피하기

답변

관련 문제