jQuery를 재사용하는 가장 좋은 방법은 무엇입니까?

Question

좋아, 거기에 너무 많은 접근 방식이 있지만, 난 단지 1에 관심이 있지만 어떤 접근 방식을 사용합니까? Dunno ...

기본적으로 여기에 딜레마가 있습니다. 페이지 본문 내에서 jQuery에 대한 후속 호출이있을 것입니다. jQuery가 이미 정의되어 있는지 알아야합니다. jQuery가 이미 정의되어 있는지 확인해야합니다. jQuery가로드되어 있지 않은 경우 jQuery를로드하십시오. 이제 jQuery가 실제로 정의 될 때까지 jQuery 코드를 실행하지 않아도된다.

: 여기

내가 사용하고 있지만, 그것이 내가 구글 크롬에서이 후속 호출에 오류가 점점 오전 의미에서 결함이 있는지의

다음

내 코드입니다 (jQuery를 정의되지 않은 것을 말한다)

if(!window.jQuery) 
{ 
    var script = document.createElement("script"); 
    script.type = "text/javascript"; 
    script.async = false; 
    script.src = "//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"; 
    var oScripts = document.getElementsByTagName("script"); 
    var s = oScripts[0]; 

    s.parentNode.insertBefore(script, s); 
} 

function dpmodPollBgColor() 
{ 
    jQuery(document).ready(function($){ 
    // Uncaught ReferenceError: jQuery is not defined 
     $.cssHooks.backgroundColor = { 
      get: function(elem) { 
       if (elem.currentStyle) 
        var bg = elem.currentStyle["backgroundColor"]; 
       else if (window.getComputedStyle) 
        var bg = document.defaultView.getComputedStyle(elem, 
         null).getPropertyValue("background-color"); 
       if (bg.search("rgb") == -1) 
        return bg; 
       else { 
        bg = bg.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/); 
        function hex(x) { 
         return ("0" + parseInt(x).toString(16)).slice(-2); 
        } 
        return "#" + hex(bg[1]) + hex(bg[2]) + hex(bg[3]); 
       } 
      } 
     } 

     $(".bar-container").each(function() { 
      if($(this).children(":first").css("width") != "0px") 
      { 
       var hexColor = $(this).children(":first").css("background-color"); 
       var bgColor = shadeColor(hexColor, 50); 
       $(this).css({"background-color": bgColor}); 
      } 
     }); 
    }); 
} 

if (document.addEventListener) 
    window.addEventListener("DOMContentLoaded", dpmodPollBgColor, false); 
else 
    addLoadEvent(dpmodPollBgColor); 

내가 간섭을 원하지 않기 때문에 onReadyStateChange을 사용하고 싶지 않습니다. 다른 AJAX는 같은 페이지에서 다른 AJAX를 호출합니다.

기본적으로 jQuery가로드되어 있지 않으면로드 할 방법이 필요합니다. 2. jQuery가 실제로로드를 완료 할 때까지 jQuery가 내부에있는 기능을 수행하지 않습니다. 3. jQuery에 어떤 변수가 정의 되더라도 페이지의 다른 jQuery 코드와 간섭하지 않습니다. 예를 들어, 다른 코드가 $ 대신에 usin으로 jQuery를 정의하는 경우.

jQuery의 여러 인스턴스가 서로 조화를 이루는 데 어려움을 겪고 있습니다.

1. if(!window.jQuery) 문을 통해로드되지 않은 경우 jQuery를 정의하는 if 문을 사용하여

   내가 지금 사용하고있는 방법은 이것이다.

2. 함수를 정의하고이 함수의 내부에서 모든 jQuery를 포장 :

   기능 FUNCTIONNAME() { jQuery를 (문서) .ready (함수 ($) {

   // 모든 jQuery 코드 여기에

   }); 그렇지 않으면 내장 함수는 어떻게 든 구현에 결함이 있습니다 AddLoadEvent()

라고하지만, 논리가 오른쪽으로 보인다 window.addEventListener 가능하면 경우에 사용하는 기능에 onLoad를로드 }

시도, 나를. Google 크롬에서 다른 함수 이름을 사용하여 동일한 코드의 여러 인스턴스에서이 작업을 수행하는 방법은 무엇입니까? 다른 모든 브라우저에서 정상적으로 작동하며 Google 크롬을 사용합니다.

감사합니다.

Answer 1

당신은 세리우스 실수가 있습니다. 여기에 그들 중 일부 :

내가 사용하는 방법은 다음과 같습니다. if (! window.jQuery) 문을 통해로드되지 않으면 jQuery를 정의하는 if 문을 사용하십시오.

물론 JQuery 개체가 존재하지 않으므로 오류가 발생합니다. 짝수 JQuery 파일이 아직 없으면 JQuery 객체를 사용하려고한다.

if(!window.jQuery)//requesting JQuery object but.. 
{ 
    var script = document.createElement("script"); 
    script.type = "text/javascript"; 
    script.async = false; 
    script.src = "//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js";//here is when you are loading its file. 
    var oScripts = document.getElementsByTagName("script"); 
    var s = oScripts[0]; 

    s.parentNode.insertBefore(script, s); 
} 


****Define a function, and wrap all jQuery inside of this function:** 

    function FunctionName() { jQuery(document).ready(function($){ 

    }); }* 

*

무엇을 위해이 땅에 사람은 함수 내부의 .ready() 기능을 포장 것이기 ?? .ready()은 그 이름이 나타내는대로 만들어진 기능입니다. 문서가 준비되면을 함수에 넣지 마십시오.