内联 jQuery 脚本在其后加载 jquery.js 时中断（在页脚中）答案

【问题标题】：Inline jQuery script breaks when jquery.js loaded after it (in footer)内联 jQuery 脚本在其后加载 jquery.js 时中断（在页脚中）
【发布时间】：2014-03-20 06:17:22
【问题描述】：

我正在页脚中加载 jquery.min.js。只要在脚本包含之前文档正文中没有内联 jquery 调用，它就可以正常工作。

例如，

<div><script>jQuery(document).ready(function(){//jQuery('anything')});</script></div>

抛出错误：

Uncaught ReferenceError: jQuery is not defined (index):63 (anonymous 函数）

第 63 行引用了内联脚本。 jquery.js 包含在此引用之后的页脚中。有什么办法可以使这项工作并将 jQuery 留在页脚中？

【问题讨论】：

不，必须先加载 jQuery，然后才能使用任何 jQuery。
这是有道理的。那么，这个脚本是否可以使用原生 javascript 调用来确定 document.ready 何时被触发，然后在其中包装 jQuery 调用？

标签： jquery

【解决方案1】：

错误很明显，jQuery 未定义，因此无法使用。最简单的解决方案是在调用内联代码之前加载 jQuery 库。

如果你绝对不能，你将不得不使用不同于 jQuery(document).ready(...) 的东西，这本身并不是一件小事，需要仔细考虑 (take a look at this SO question for some ideas)

我确实注意到您使用的是jQuery(document).ready(...) 而不是$(document).ready(...) 您是否还加载了不同的框架（mootools、原型等？）如果是这样（并且这些库正在更早加载），您可以简单地挂钩相当于jQuery(document).ready(...)

【讨论】：

脚本是从第三方插件加载的。我只是想处理它，打破我从头到脚移动脚本的方法。
在这种情况下，如果您不能编辑代码，那么您就不能将 jQuery 保留在页脚中。我知道将大脚本放在页面末尾越来越成为最佳实践，但听起来你没有这种奢侈。

【解决方案2】：

正是出于这个原因，我创建了一个简单的垫片。它创建了一个全局 jQuery（和 $）对象，该对象只能为 domReady 排队函数。它非常小，因此您可以将其内联在 HEAD 标记中（内联以避免整个 dns 查找、延迟等问题），然后按照您描述的方式编写的正文中的任何代码仍然可以正常运行。

https://github.com/withjam/jqshim-head

shim 本质上存储了所有传递给 jQuery() 或 jQuery().ready() 的函数，等待真正的 jQuery 可用，然后将它们传递给真正的 jQuery() 调用以继续执行 isDomReady 循环.

如果有帮助，请告诉我。

【讨论】：