dojo 教程：dojo 未定义答案

【问题标题】：dojo tutorial: dojo is not defineddojo 教程：dojo 未定义
【发布时间】：2013-01-13 22:57:55
【问题描述】：

我想开始使用道场。

因此我使用他们的教程：http://dojotoolkit.org/documentation/tutorials/1.8/hello_dojo/

最简单的教程显示这个页面

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Tutorial: Hello Dojo!</title>
</head>
<body>
    <h1 id="greeting">Hello</h1>
    <!-- load Dojo -->
    <script src="//ajax.googleapis.com/ajax/libs/dojo/1.8.1/dojo/dojo.js"
               data-dojo-config="async: true"></script>
</body>
</html>

我现在打开页面（在他们的页面上尝试了本地和托管版本）。当我写作时

dojo.query("h1")

在我的萤火虫控制台中，我收到消息：

ReferenceError: dojo 未定义

请帮忙

【问题讨论】：

标签： javascript html dojo

【解决方案1】：

这个问题没有正确答案。这不起作用的原因是您启用了async 模式。这实际上是 Dojo 核心将被异步加载。

Dojo 核心 是加载dojo.js 文件时自动加载的Dojo 部分。它设置了一个名为dojo 的全局变量，其中包含dojo.query 部分等基本功能。

您的问题是您实际上并没有等待核心加载。因为核心没有加载，dojo 将是undefined，给你那个错误。

在使用 AMD 加载程序 (require()) 时，您应该只使用 async 模式，如果您不想使用它（旧模式），您只需将 async 放入 false。但这种模式实际上已弃用，将在 Dojo 2.0 中移除。

另一种解决方案是使用 AMD 加载器（异步模块加载器），正确的语法是：

require([ "dojo/query" ], function(query) {
    query("h1");
});

在此示例中，您可能有机会尚未加载 DOM，因此最好的答案是等待 DOM 也加载，结果是：

require([ "dojo/query", "dojo/domReady!" ], function(query) {
    query("h1");
});

当您使用协议隐含 URL 时，您表示它正在工作。然而，事实并非如此。它突然起作用的唯一原因是因为您离开了 async 属性，默认为 false。

与Christofer 所说的不同，旧模式仍然可用，但已弃用。

Agnes' answer 可以工作，因为它使用的是 AMD 加载程序。但是，将遗留代码和新语法结合起来看起来并不好。如果您选择 AMD，则应将所有内容都放入 AMD，而不仅仅是某些部分。

【讨论】：

【解决方案2】：

之前没有 Dojo 的经验，我阅读了一些文档。特别是this part，说起“现代道场”。

事实证明，从 1.7 版开始，您不能再仅仅加载 dojo.js 并期望调用 dojo.something。有了“新道场”，就再也不可能了。这就是你得到dojo is not defined的原因。

要了解更多信息，请阅读更新后的文档以了解如何开始，但这里是一个简单的 hello world：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Tutorial: Hello Dojo!</title>
    <link rel="stylesheet" href="../../../resources/style/demo.css">
</head>
<body>
    <h1 id="greeting">Hello</h1>
    <!-- load dojo and provide config via data attribute -->
        <script src="//ajax.googleapis.com/ajax/libs/dojo/1.8.3/dojo/dojo.js" data-dojo-config="isDebug:1, async:1"></script>
    <script>
        require(["dojo/dom", "dojo/domReady!"], function(dom){
            var greeting = dom.byId("greeting");
            greeting.innerHTML += " from Dojo!";
        });
    </script>
</body>
</html>

如果你喜欢使用旧的方式，我想你可以参考 1.7 之前的 Dojo 版本，但是使用旧版本很少是一个好的方法，所以我建议你学习新的做事方式.

【讨论】：

感谢您指出这一点！事实上，“现代 dojo”教程告诉您不应该使用类似于 dojo.* 的命令，因为这些命令已被弃用。据我了解，他们应该在 2.0 之前发出警告
@RCK69 好的，很可能就是这样。自己没用过Dojo，所以不知道。我刚刚注意到，当我使用上面的 hello world-example 加载 dojo 的方式时。它起作用了，而使用 dojo. 导致异常。

【解决方案3】：

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Title</title>
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.9.1/dojo/dojo.js" data-dojo-   config="async: true"></script>
</head>

<body>

<script>
require(["dojo"], function(dojo){
dojo.ready(function(){  
//Your code here
});
});
</script>

</body>
</html>

【讨论】：

【解决方案4】：

您确定 dojo 的来源位于“//ajax.googleapis.com/ajax/libs/dojo/1.8.1/dojo/dojo.js”中，因为您的文件夹结构类似于 googleapis 文件夹中的“@ 987654321@"

【讨论】：

这被称为protocol-relative URL 并且可以正常工作。那里没有错误。
当我使用完整的 url 并将第 10 行和第 11 行替换为：