我正在寻找一种在页面完全加载后加载 jquery 的方法。
好吧，这里有很多关于它的问题和答案，但都描述了如何在页面或 jquery 完全加载后运行需要 jquery 的脚本。
我正在寻找的是加载页面然后调用 jquery 并在加载 jquery 后调用函数。就像是：
document.onload=function(){
var fileref=document.createElement('script');
fileref.setAttribute("type","text/javascript");
fileref.setAttribute("src", 'http://code.jquery.com/jquery-1.7.2.min.js');
//Here I need an event to know that jquery is
//loaded to run stuff that needs jquery
}
尝试这个：
$(document).ready(function() {
// When the document is ready
// Do something
});
您还可以使用：
$(window).bind("load", function() {
// Your code here.
});
对于您的问题，解决方案可能是将 google 托管的 CDN 与某些库附加：
https://developers.google.com/speed/libraries/devguide
此外，您可以在页面底部添加它（就在之前</body>）：
<script type="text/javascript">
(function() {
var script = document.createElement('script')
script.setAttribute("type", "text/javascript")
script.setAttribute("src", "https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js")
document.getElementsByTagName("head")[0].appendChild(script)
})();
</script>
但是，在我看来，这是有风险的。您对 jquery 有一个异步调用，因此您的 jquery 必须等到它加载（即$(document).ready在这种情况下不起作用）。所以我的答案是：使用谷歌建议的 CDN；将您的 javascript 放在之前的底部</body>；并且，忽略分析器的标志。
建议在块的底部加载脚本<body>以加快页面加载速度，如下所示：
<body>
<!-- your content -->
<!-- your scripts -->
<script src=".."></script>
</body>
</html>
您可以尝试使用您的函数并使用超时等待，直到加载 jQuery 对象
代码：
document.onload=function(){
var fileref=document.createElement('script');
fileref.setAttribute("type","text/javascript");
fileref.setAttribute("src", 'http://code.jquery.com/jquery-1.7.2.min.js');
document.getElementsByTagName("head")[0].appendChild(fileref);
waitForjQuery();
}
function waitForjQuery() {
if (typeof jQuery != 'undefined') {
// do some stuff
} else {
window.setTimeout(function () { waitForjQuery(); }, 100);
}
}
我的猜测是您在<head>页面的部分中加载了 jQuery。虽然这无害，但它会减慢页面加载速度。尝试使用此模式来加快 DOM 树的初始加载时间：
<!doctype html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<!-- CSS -->
<link rel="stylesheet" type="text/css" href="">
</head>
<body>
<!-- PAGE CONTENT -->
<!-- JS -->
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script>
$(function() {
$('body').append('<p>I can happily use jQuery</p>');
});
</script>
</body>
</html>
<body>只需在标签末尾添加脚本即可。
由于实际原因，有一些脚本需要放在头脑中，最著名的库是Modernizr
如果您可以从自己的服务器加载 jQuery，那么您可以将其附加到您的 jQuery 文件中：
jQuery(document).trigger('jquery.loaded');
然后你可以绑定到那个触发的事件。
在关闭正文标记之前将您的脚本包含在页面底部。
更多信息在这里。
如果您试图避免在加载内容之前加载 jquery，最好的方法是简单地将对它的引用放在页面底部，就像许多其他答案所说的那样。
使用 CDN。这样，您的站点可以使用用户可能在其计算机上拥有的缓存版本。//开头的 允许它被调用（并使用相同的资源），无论它是 http 还是 https 。例子：
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
使用 CDN 有几个很大的好处：它使用户更有可能从另一个站点缓存它，因此不会有下载（也没有渲染阻塞）。此外，CDN 使用最近、最快的可用连接，这意味着如果他们确实需要加载它，它可能会比连接到您的服务器更快。来自谷歌的更多信息。
将脚本放在底部。将尽可能多的 js 移到页面底部。我使用 php 在页脚下方包含一个包含我所有 JS 资源的文件。
如果您使用的是模板系统，您可能需要在整个 html 输出中传播 javascript。如果您在页面呈现时调用的脚本中使用 jquery，这将导致错误。要让您的脚本等到 jquery 被加载，请将它们放入
window.onload() = function () { //... your js that isn't called by user interaction ... }
这将防止错误，但仍会在用户交互之前运行且无需计时器。
当然，如果 jquery 被缓存，那么将它放在哪里并不重要，除了页面速度工具会告诉你你正在阻止渲染。
我在 6 年前问过这个问题，我得到的任何答案都有一些缺陷。后来我自己制定了一个解决方案，从那时起我一直在使用多年。现在我再次遇到自己的问题，并且看到它有很多观点，我想分享它，因为我认为它可能对其他人有所帮助。
此问题主要发生在 Master-Detail 类型的页面（可以是旧的 .master 和 .aspx 页面）或（asp.net 中的布局和视图）或任何类似情况可能在其他 Web 开发语言上，但总有一个 master-涉及的细节模式。
对于解决方案，我只需在页面开头添加一个数组：
<script>var after = [];</script>
任何需要 jQuery 的函数或将在本节之后运行的任何其他脚本，而不是运行它，我只是将它推送到这个数组：
after.push(function(){
// code that requires scripts that will load later,
//might be for example a jQuery selector or ...
});
然后在页面的最后，在关闭 body 标签之前（当然脚本现在已经加载）我运行（这里命名的）after数组中的所有函数：
<script>for(var i=0;i<after.length;i++)after[i]();</script>
</body>
我发现这种方式非常简单、简单且完美无缺。