Javascript 我可以在同一页面上使用多个版本的jQuery吗？

我正在从事的一个项目需要在客户的网页上使用jQuery。客户将插入我们将提供的代码块，其中包括一些在

创建的

中构建小部件的

元素。如果他们还没有使用最新版本的jQuery，这也将包括（很可能）一个针对Google托管版本jQuery的

问题是一些客户可能已经安装了较旧版本的jQuery。虽然这至少在相当新的版本下是可行的，但我们的代码确实依赖于jQuery库中最近引入的一些功能，因此当客户的jQuery版本太旧时，必然会出现一些实例。我们不能要求他们升级到jQuery的最新版本

是否有任何方法可以加载新版本的jQuery，以便仅在我们的代码上下文中使用，而不会干扰或影响客户页面上的任何代码？理想情况下，我们可以检查jQuery是否存在，检测版本，如果版本太旧，则加载最新版本以用于代码

---

我有一个想法，将jQuery加载到客户域中的

，其中也包括我们的

，这似乎是可行的，但我希望有一种更优雅的方法来实现它（更不用说没有额外

的性能和复杂性损失）。

是的，这是可行的，因为jQuery的无冲突模式

var jQuery_1_1_3=$.noConflict（true）；
var jQuery_1_3_2=$.noConflict（true）；

然后，代替

$（'#选择器'）。函数（），您需要执行
jQuery_1_3_2（'#选择器'）。函数（）或
jQuery_1_1_3（'#选择器'）。函数（）
取自：


原始页面加载他的“jquery.versionX.js”-
$
和
jquery
属于versionX
您称您的“jquery.versionY.js”--现在
$
和
jquery
属于versionY，另外
$
和
\ujquery
属于versionX
my_jQuery=jQuery.noConflict（true）
--现在
$
和
jQuery
属于versionX，
$
和
\ujQuery
可能为空，
my\ujQuery
是versionY
可以加载jQuery的第二个版本，使用它，然后恢复到原始版本，或者如果以前没有加载jQuery，则保留第二个版本。以下是一个例子：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">
    var jQueryTemp = jQuery.noConflict(true);
    var jQueryOriginal = jQuery || jQueryTemp;
    if (window.jQuery){
        console.log('Original jQuery: ', jQuery.fn.jquery);
        console.log('Second jQuery: ', jQueryTemp.fn.jquery);
    }
    window.jQuery = window.$ = jQueryTemp;
</script>
<script type="text/javascript">
    console.log('Script using second: ', jQuery.fn.jquery);
</script>
<script type="text/javascript">
    // Restore original jQuery:
    window.jQuery = window.$ = jQueryOriginal;
    console.log('Script using original or the only version: ', jQuery.fn.jquery);
</script>


var jQueryTemp=jQuery.noConflict（true）；
var jQueryOriginal=jQuery | | jQueryTemp；
if（window.jQuery）{
log（'Original jQuery:'，jQuery.fn.jQuery）；
log（'secondjquery:'，jQueryTemp.fn.jQuery）；
}
window.jQuery=window.$=jQueryTemp；
log（'scriptusingsecond:'，jQuery.fn.jQuery）；
//还原原始jQuery：
window.jQuery=window.$=jQueryOriginal；
log（'使用原始或唯一版本的脚本：'，jQuery.fn.jQuery）；
查看并尝试后，我发现它实际上不允许一次运行多个jquery实例。在四处搜索后，我发现这正是解决问题的方法，而且代码少得多。

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
    <script>var $j = jQuery.noConflict(true);</script>
    <script>
      $(document).ready(function(){
       console.log($().jquery); // This prints v1.4.2
       console.log($j().jquery); // This prints v1.9.1
      });
   </script>

页面上可以有任意多个不同的jQuery版本

使用：

var$i=jQuery.noConflict（）；
警报（$i.fn.jquery）；
var$j=jQuery.noConflict（）；
警报（$j.fn.jquery）；
var$k=jQuery.noConflict（）；
警报（$k.fn.jquery）；

|
我想说的是，您必须始终使用jQuery最新或最新的稳定版本。但是，如果需要对其他版本执行某些操作，则可以添加该版本并将
$
重命名为其他名称。比如说

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script>var $oldjQuery = $.noConflict(true);</script>

当然，是的，你可以。此链接包含有关如何实现此目标的详细信息：。
非常感谢，ceejayoz！这看起来是一个可行的解决方案——唯一的潜在问题是我无法控制代码解决方案的第一部分（将较旧版本的jQuery分配给不同的别名）。客户使用jQuery的方式会有所不同，这超出了我的控制范围。我可以安全地只使用后半部分，还是两个库都需要调用noConflict（）？是的，您应该可以只使用后半部分。这对原始页面真的是透明的吗？如果他们在这段代码之后使用$或jQuery，这是指他们自己的jQuery版本还是较新的版本（可能安装了较少的插件）？@ceejayoz，如果您有一个使用大量$的自调用函数，会发生什么。我们将不得不在noconflict部分中将每一个$都更改为jquery_1_3_2？？？@blachawk不，只需将其别名<代码>（函数（$）{/*此处的代码*/}（jquery_x_x_x））我不明白，直到我去了链接。“当您加载jQuery.x.x.js时，它将覆盖现有的$和jQuery变量…但它保留了它们的备份副本（在$和jQuery中）。调用noConflict（true）可以恢复js包含之前的情况。”今后，请更明确地引用外部源。有关更多信息，请参阅我遇到了相同的问题。由于我在嵌入式脚本中只使用了几次jQuery，所以我决定完全放弃jQuery，直接用JavaScript做我需要的事情。此站点：非常有用。为了避免在许多地方重命名jquery变量，您可以将旧代码包含在以下内容中：
（函数（$）{}）（$j）
$j(function () {
        $j('.button-pro').on('click', function () {
            var el = $('#cnt' + this.id.replace('btn', ''));
            $j('#contentnew > div').not(el).animate({
                height: "toggle",
                opacity: "toggle"
            }, 100).hide();
            el.toggle();
        });
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
<script>
    var $i = jQuery.noConflict();
    alert($i.fn.jquery);
</script> 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
    var $j = jQuery.noConflict();
    alert($j.fn.jquery);
</script> 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
    var $k = jQuery.noConflict();
    alert($k.fn.jquery);
</script> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script>var $oldjQuery = $.noConflict(true);</script>

$(function(){console.log($.fn.jquery)});
$oldjQuery (function(){console.log($oldjQuery.fn.jquery)})