Question

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

Answer 1

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

然而，在使用带有dojo的jQuery时要记住一些事情，特别是dojo version 1.8及其完整的AMD支持。它更干净（特别是如果你不能在你的网站的头脑中引入jQuery ）来利用AMD（asynchronous module definition）。您需要在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>

我的文件夹结构在根目录下只有一个libs文件夹，这就是为什么我的基本网址有“./”，但你可以很容易pull from a cdn location。

如果没有此配置条目，jQuery将无法按预期运行，并且您最终可能会在控制台中弹出“不是函数”错误。

如果您确实添加了一个单独的脚本标记以引入jQuery或其他第三方框架并使用AMD执行相同的操作，那么当您 {{3>时，您最终会再次将其拉出来它首次用于dojo。

Answer 2

您可以在彼此旁边使用它们而不会出现任何问题，因为Dojo不会像其他一些javascript库一样覆盖$。

Answer 3

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

以下片段甚至将$别名化为dojo.query并且仍然使用jQuery而不会发生冲突（不过我不推荐它！）：

  define.amd.jQuery = true;

  require(["jquery", "dojo/query", "dojo/NodeList-dom"],
  function(jquery, $) {
    $("output").style("visibility", "visible");     // using Dojo
    jquery("#output").css("visibility", "hidden");  // using jQuery
  });

完整说明和源代码：Loading jQuery with Dojo 1.7 AMD loader

Answer 4

例如，您可以命名jQuery，以避免冲突。

检查http://docs.jquery.com/Using_jQuery_with_Other_Libraries

Answer 5

jQuery现在支持AMD很长一段时间了。

您可以使用＆＃34;路径＆＃34; ADM配置的属性告诉您的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);
}

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

5 个答案:

注意