JavaScript + Ajax 実践サンプル集 - 複数のjQueryライブラリを同時に使用するには

複数のjQueryライブラリを同時に使用するには

説明コード関連書籍コメント投稿

このサンプルは、複数のjQueryライブラリを同時にロードして個別のライブラリを利用します。ここで紹介しているテクニックは、jQueryのプラグインがjQueryのバージョンに依存するときに利用すると便利です。jQuery 1.4.2をデフォルトのライブラリとするときは、 var jQuery142 = $.noConflict(true); が不要です。

このサンプルを編集して試してみる

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>Using multiple versions of jQuery</title>
  
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script>
  <script type="text/javascript">
    var jQuery126 = $.noConflict(true);
    alert('Loaded jQuery version ' + jQuery126.fn.jquery);
  </script>
  
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
  <script type="text/javascript">
    var jQuery142 = $.noConflict(true);
    alert('Loaded jQuery version ' + jQuery142.fn.jquery);
  </script>
  <script type="text/javascript">
    // use jQuery 1.2.6
    (function ($) {
      $(document).ready(function () {
        $('<button>Use jQuery 1.2.6</button>')
				.click(function () {
				  alert('Top: ' + $(this).offset().top + '\n' +
						'jQuery: ' + $.fn.jquery);
				})
				.appendTo('p');
      });
    })(jQuery126);

// use jQuery 1.4.2
    (function ($) {
      $(document).ready(function () {
        $('<button>Use jQuery 1.4.2</button>')
				.click(function () {
				  alert('Top: ' + $(this).offset().top + '\n' +
						'jQuery: ' + $.fn.jquery);
				})
				.appendTo('p');
      });
    })(jQuery142);
  </script>
</head>
<body>
  <h3>Using multiple versions of jQuery</h3>
  <p id="placeholder">
  </p>
</body>
</html>

コメント・提案の投稿！

名前
メール
件名
本文

JavaScript + Ajax 実践サンプル集 (1530本以上)　◇編集して実行可能◇

jQueryを使い倒せ!　jQueryでAjaxを実装するための基礎知識と実践サンプルを一挙公開中... »»jQueryテンプレート42選!

複数のjQueryライブラリを同時に使用するには

JavaScript + Ajax 実践サンプル集 (1530本以上) ◇編集して実行可能◇

jQueryを使い倒せ! jQueryでAjaxを実装するための基礎知識と実践サンプルを一挙公開中... »»jQueryテンプレート42選!

複数のjQueryライブラリを同時に使用するには

JavaScript + Ajax 実践サンプル集 (1530本以上)　◇編集して実行可能◇

jQueryを使い倒せ!　jQueryでAjaxを実装するための基礎知識と実践サンプルを一挙公開中... »»jQueryテンプレート42選!