我对dojo/domReady!
和不同版本(Built vs. SDK)有过奇怪的体验。脚本按以下顺序加载:首先是第三方库(x3dom.js),然后是dojo,最后是我们自己的。
<!-- load x3dom -->
<link rel="stylesheet" href="../x3dom/dist/x3dom.css" />
<script type="text/javascript" src="../x3dom/dist/x3dom-full.js"></script>
<!-- load Dojo -->
<script type="text/javascript">
var dojoConfig = {
async: true,
parseOnLoad: false,
isDebug: false,
baseUrl: "../dist/",
packages: [
{ name: "dojo", location: "dojo" },
{ name: "dijit", location: "dijit" },
{ name: "dojox", location: "dojox" }
]
};
</script>
<script src="../dist/dojo.js"></script>
<script src="../dist/dijit.js"></script>
<script src="../dist/dojox.js"></script>
<script src="js/myCode.js"></script>
在我们的代码中,我们为X3DOM准备了元素,但我们需要等到DOM完全加载完毕。这就是我们使用dojo/domReady!
:
require([
"dojo/parser",
"dojo/domReady!"
], function(parser) {
parser.parse().then(function() {
console.log("DOM Loaded");
// ... prepare stuff for x3dom
x3dom.runtime.ready = function() { console.log('X3DOM ready'); }; // might never be called depending on the size of the document
});
});
dojo的内置版本以某种方式注册我们的自定义函数并在任何其他代码之前执行它。但是,使用Dojo的SDK版本显示,由于某些window.addEventListener('load', onload, false);
,第三方代码正在我们的代码之前执行,因此X3DOM无法加载其元素。
它还取决于正在加载的文档的大小。如果这个很小,那么构建版本和SDK版本会给出相同的结果。如果文档很大并且必须进行大量的解析,那么可以体验前面提到的效果。
Dojo的内置版本和SDK版本之间的主要区别是什么?为什么他们在dojo/domReady!
上的表现完全不同?