Javascript jQuery/Dojo-如何将jQuery与Dojo工具包一起使用

如何将jQuery与Dojo工具包结合使用？我听说这两个库同时使用，jQuery用于DOM相关，Dojo用于UI（dijit），但我找不到任何教程或示例。如果我同时加载两个库，是否会遇到任何冲突或问题？

例如，您可以为jQuery命名名称空间，以避免冲突

---

选中

由于Dojo不像其他javascript库那样重写$，因此您可以将它们并排使用，而不会出现任何问题。

您可以使用Dojo的AMD加载程序来加载jQuery。

下面的代码片段甚至将

$

化名为

dojo.query

，并且仍然使用jQuery而没有冲突（不过我不建议这样做！）：

---

完整解释和源代码：

您可以通过网站头部的脚本标签将jQuery拉入应用程序，使用jQuery时不会与dojo发生冲突

但是，在将jQuery与dojo结合使用时，尤其是在使用jQuery及其对AMD的全面支持时，需要记住一些事情。它更干净（，尤其是当你不能在你的网站中引入jQuery时，）可以利用AMD（）。您需要在dojo配置脚本中创建一个包条目，以便正确地拉入框架。下面是一个为jquery和jquery ui使用库位置的示例

<!-- external library configuration code included in header to make sure this
    is loaded before code in body-->
    <!-- dojo config -->
    <script>
            /* Instead of using the inline dojo-config attribute
            * create this variable so we can configure dojo here.
            * This seems a little clearer, easier to read as a config.
            */
            var dojoConfig = {
                baseUrl: "./",
                async: true,
                isDebug: true,
                parseOnLoad: false,//false to allow for us to call this independantly in js later on

                //here are the packages dojo will be aware of and related js files
                packages: [
                    //dojo specific packages
                    {name: "dojo", location: "libs/dojo"},
                    {name: "dijit", location: "libs/dijit"},
                    {name: "dojox", location: "libs/dojox"},
                    {name: "jquery", location: "libs/jquery", main: "jquery-1.8.2"},
                    {name: "jqueryui", location: "libs/jquery", main: "jquery-ui-1.9.1"},
                ]

            };


    </script>

/*而不是使用内联dojo config属性
*创建此变量，以便我们可以在此处配置dojo。
*这看起来更清晰，更易于作为配置阅读。
*/
var dojoConfig={
baseUrl:“./”，
async:true，
是的，
parseOnLoad:false，//false允许我们稍后在js中独立地调用它
//下面是dojo将知道的包和相关的js文件
套餐：[
//dojo特定包
{名称：“dojo”，位置：“libs/dojo”}，
{名称：“dijit”，位置：“libs/dijit”}，
{名称：“dojox”，位置：“libs/dojox”}，
{name:“jquery”，位置：“libs/jquery”，main:“jquery-1.8.2”}，
{name:“jqueryui”，位置：“libs/jquery”，main:“jquery-ui-1.9.1”}，
]
};

我的文件夹结构在根目录下只有一个libs文件夹，这就是为什么我将“/”作为基本url，但您也可以轻松地使用它

如果没有这个配置条目，jQuery将无法按预期运行，并且您可能会在控制台中弹出“Isnota function”错误

---

如果您确实在jQuery或其他第三方框架中添加了一个单独的脚本标记，并使用AMD来执行相同的操作，那么当您第一次为dojo加载它时，您将在第二次加载它。

jQuery支持AMD已经有一段时间了

您可以使用ADM config的“path”属性告诉AMD加载程序在哪里可以找到jQuery：

var amdconfig = {
  baseUrl: __AMD_CONFIG_BASE_URL__,
  packages: [
    {name: "dojo", location: "./lib/dojo"},
    {name: "app", location: "./app"}
  ],
  paths: {
    jquery: "./lib/jquery/jquery-1.12.4"
  }
};

然后，您可以像导入任何其他AMD模块一样将jQuery导入ADM模块，并将其与Dojo模块一起使用：

define([
  "dojo/dom",
  "jquery"
], function(
  dom,
  $
) {
  
  ...

});

---

注 对于使用RequireJS而不是Dojo的AMD项目，您可以使用相同的配置：

if (require.config) {
  // RequireJS
  require.config(amdconfig);
} else {
  // Dojo
  require(amdconfig);
}

---

为什么不推荐它？@jabberwockydeciler:将

$

别名为

dojo.query

不是一个好主意，因为这对jQuery和dojo开发人员来说都非常混乱。它不符合两个组的编码约定。

if (require.config) {
  // RequireJS
  require.config(amdconfig);
} else {
  // Dojo
  require(amdconfig);
}