未捕获的ReferenceError：当jquery.js位于文档末尾时，未定义$

我有一个项目，其中所有JS文件在页脚中引用，建议用于页面加载的速度，包括到Jquery文件的链接。 这段代码产生一个“未捕获的ReferenceError”，我假设因为在调用脚本之前尚未定义Jquery：

     
 hover over me 
  $(function(){ $('#example').popover({ trigger:'hover' }); })      

如果我将Jquery链接移动到标题，那么代码运行正常，但这将减慢页面加载时间。

是否有更好的方法来声明我的函数，以便它不会抛出此UncaughtReference错误，或者保持头部中的Jquery链接是最佳解决方案？

Answer 1

这是因为你在加载jQuery之前尝试使用jQuery 。 你需要在文档的头部放置像jQuery这样的库

通常，您的脚本位于文档的末尾，靠近关闭的body标记和库，例如您正在使用的库，位于

Answer 2

我喜欢在底部保持jquery，你只需要确保首先加载整个DOM，并检查没有jQuery，因为它还不可用。 请尝试使用此代码：

 document.addEventListener("DOMContentLoaded", function(event) { $(function(){ $('#example').popover({ trigger:'hover' }); }); }); 

Answer 3

在引用jQuery库之前，您需要包含jQuery。

改为：

另请注意，最好在文档的页脚中包含jQuery和其他JavaScript，以确保页面呈现不会延迟。

Answer 4

最近在jsTree网站上我看到了另一种技术

在顶部（在HEAD标签中）你设置这个：

现在你可以随时随地做 …

最后包括jquery.js作为usal然后最后一个脚本是：

希望这对某人有用……

Answer 5

脚本按顺序从文档的顶部到底部执行，因此您尝试在加载之前引用jQuery库。

要解决此问题，您可以将自己的脚本放在单独的文件中，然后在jQuery库之后导入它们，或者将脚本标记放在jQuery导入下面。