ページのjQueryバージョンをGreasemonkeyに置き換えてください

Question

jQueryバージョンのページをgreasemonkeyに置き換えるにはどうすればよいですか？

私はjqueryの新しいバージョンでサイトをテストしようとしていますが、私はdev環境を持っていません。

Answer 1

私はあなたがこれを行うためのjQueryとのGreasemonkeyについて求めている知っているが、完全異なる代替、Fiddler私をオフにしましょう。

サイトを新しいバージョンのjQueryでテストしていて、の場合は、実際にはに改ざんの変更などをテストしたいサイトをとテストしたいのに対し、JavaScript（greasemonkey）ベースの事後置換は正確なシミュレーションではありません。

フィドラーを使用すると、ブラウザーが（ブラウザが認識されていない）が要求するjQueryファイルを置き換えることができます。あなたが実際に完全にテストしているこの方法では、ページ内に新しいバージョンをまっすぐに置くことができます。ページ内のJSテクニックはありませんが、そこに到達するには全く正確ではないかもしれません（ハンドラは既に取り込まれています。 ）

Eric Lawフィドラーの（作成者）正確これを行う方法の優れたブログの記事がありますポストはして縮小さバージョンをスワップアウトのために書かれた

Swapping out JQuery with Fiddler

フルバージョン（便利！）または新しいバージョンのデバッグでは、両方の用途に注意してください...両方とも非常にのデバッグ/テスト時間を節約するのに便利です。

Answer 2

ソース管理と書面によるリリースチェックリストを使用することで、開発環境を構築することで多くの悲しみが軽減されます（ほとんどの有料作業の要件です）。
~~~

既存のページにjQueryのバージョンを置き換えるための最良の方法（あなたがコントロールしていないこと）された：

1. ストップページのネイティブjQueryの読み込みから。
2. 希望するjQueryバージョンを含む<script>ノードを作成し、の前に、の前にjQueryを使用するスクリプトをロードします。

残念ながら、Greasemonkeyは＃1を実行できません。がロードされた後、ページのネイティブjQuery を改ざんするだけです - 動作する可能性があるが、ページが遅くなり、競合状態を危険にさらす方法。

1. あなたのFirefoxは、および/またはthe RequestPolicy add-on（優れたアドオンを使用するには関わらずである）the Adblock add-onを持っていることを確認してください：

   だから、私は2つのツールソリューションををお勧めします。一時的に古いjQueryのを阻止する

2. 使用自分好みまたはRequestPolicy。
   たとえば、StackOverflowの場合、ブロックhttp://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.jsがあります。 （RequestPolicyはあなたが唯一の特定の部位にブロックするURLを制限することを可能にすることに注意してください。）

3. は、所望の（それはの関わらず行うことができます自分好みかRequestPolicy設定）のjQueryのバージョンをロードするためのGreasemonkeyを使いますページの始めに。

   例えば、ステップ2からのブロックと一緒に、1.6.2にメタSOさんのjQueryをアップグレードします。このスクリプト：

   // ==UserScript== 
   // @name   _upgrade jQuery 
   // @include   http://meta.stackexchange.com/questions/* 
   // @run-at   document-start 
   // ==/UserScript== 
   
   /*--- Important! 
        (1) We need another add-on, besides Greasemonkey, to 
         disable the old, undesired script. 
        (2) The DOM is not available yet 
         (@run-at == document-start). 
        (3) We cannot use a loop to check for the DOM because 
         loading is halted while the loop runs. 
        (4) setTimeout() and setInterval() are not fast enough due 
         to minimum interval clamping. By the time they detect 
         the DOM, scripts that we need to precede may have 
         loaded. 
        (5) Therefor, we use a "set Zero Timeout" function as 
         explained by David Baron at 
          http://dbaron.org/log/20100309-faster-timeouts . 
        (6) By the time FF reports that the `document.head` is 
         available, several head elements have loaded! 
         (Is this a bug?) 
         That means that if any dependent scripts are loaded 
         before we can inject our jQuery version, then we must 
         also reload those dependent scripts. 
   */ 
   
   ////// setZeroTimeout() implementation: BEGIN 
   
   /*--- Only add setZeroTimeout to the window object, and hide 
       everything else in a closure. 
   */ 
   (function() { 
       var timeouts = []; 
       var messageName = "zero-timeout-message"; 
   
       /*--- Like setTimeout, but only takes a function argument. 
        There's no time argument (always zero) and no arguments. 
        You have to use a closure. 
       */ 
       function setZeroTimeout(fn) { 
        timeouts.push(fn); 
        window.postMessage(messageName, "*"); 
       } 
   
       function handleMessage(event) { 
        if (event.source == window && event.data == messageName) { 
         event.stopPropagation(); 
         if (timeouts.length > 0) { 
          var fn = timeouts.shift(); 
          fn(); 
         } 
        } 
       } 
   
       window.addEventListener ("message", handleMessage, true); 
   
       // Add the one thing we want added to the window object. 
       window.setZeroTimeout = setZeroTimeout; 
   })(); 
   
   ////// setZeroTimeout() implementation: END 
   
   /*--- Now wait for the DOM and then add our version of jQuery, 
       first thing. 
   */ 
   function SearchForDOM() { 
   
       var targetNode; 
       if (typeof document.head == "undefined") 
        targetNode = document.querySelector ("head, body"); 
       else 
        targetNode = document.head; 
       if (targetNode) { 
   
        var scriptNode  = document.createElement ("script"); 
        scriptNode.src  = 'http://ajax.googleapis.com/ajax/' 
             + 'libs/jquery/1.6.2/jquery.min.js'; 
        targetNode.appendChild (scriptNode); 
   
        /*--- By the time FF reports that the head element is 
         available, a key dependent script has loaded! 
         So, we reload it here, so that it can run with jQuery 
         available. 
        */ 
        var scriptNode  = document.createElement ("script"); 
        scriptNode.src  = location.protocol 
             + '\/\/' + location.host 
             + '/content/js/stub.js?v=49f661361016'; 
        targetNode.appendChild (scriptNode); 
       } 
       else 
        setZeroTimeout (SearchForDOM); 
   } 
   
   SearchForDOM(); 
   

   
   注：そのため、JS、GM、およびFirefoxの制限にjQueryに依存するスクリプトをリロードする必要があるかもしれません。 （これは、現時点では、メタスタックオーバーフローの場合である。）

Answer 3

私の場合はうまくいかなかったが、この問題に適しているようだが、ブロッカーは必要ありません。 GreaseMonkeyで：

// ==UserScript== 
// @name  alternative jquery 
// @namespace ben@host 
// @description intercept 
// @include  https://somehost.com/* 
// @grant  GM_getResourceText 
// @resource jquery_new jquery_new.js 
// @run-at  document-start 
// @version  1 
// ==/UserScript== 

var jquery_source = GM_getResourceText('jquery_new'); 
console.log('jQuery Lenght =',jquery_source.length); 

window.addEventListener('beforescriptexecute', 
function(e){ 
    if (e.target.src && 
     e.target.src.search('/1.12.4/jquery.min.js') >= 0) { 
      console.log('intercepted: '+e.target.src); 
      e.preventDefault(); 
      e.stopPropagation(); 
      window.eval(jquery_source); 
     } 
}); 

注：欠点 - 元のスクリプトが検索され、準備が実行されるので、オリジナルの外部JSファイルが読み込みに失敗しなければならないbeforescriptexecute火事の後、このアプローチは動作しません。