移动jQuery来body标签的结束？(Move jQuery to the end of body

我的朋友看了里面提到的所有的JavaScript文件移动到结束标记（结束的一篇文章</body>将提高网页的性能。

我已移动所有JS文件，除了JQuery的和JS文件被附加到事件的元件页上，如下面的端部;

$(document).ready(function(){
    //submit data
    $("#create_video").click(function(){ //... });
});

但他说了jQuery库文件移动到body标签的结束。

我不认为这是可能的，因为我对负载使用jQuery选择安装许多事件对页面元素，并使用jQuery选择它是一定要首先加载jQuery库。

是否有可能正确的结束标记之前移动JQuery的库文件页面的结尾（ </body> ）??

谢谢

Answer 1:

在$(document).ready功能说不运行，直到DOM完成实例化-因此它移动到后如jQuery库第一次加载身体是好的这么久。非常规和一些假设可能不正确了，但没关系。

Answer 2:

这是标准的做法，将所有的JS包括到你的页面的底部。这是因为当一个浏览器加载脚本，它不会产生一个新的线程来做到这一点，所以基本上浏览器会等待，直到它已加载脚本才进到下一行之前。

这意味着你的用户来说，他们会看到空白屏幕。更好的让他们看到完整的（ISH）页面，那么它看起来并不像它已经停滞。

Answer 3:

只要看看帐户了，jQuery JavaScript文件必须在任何调用之前加载$(...)函数。

Answer 4:

使用“DOM已准备就绪队列”收集要执行的功能，一旦jQuery是加载和DOM已准备就绪。

例：

<html>
  <head>
    <script type="text/javascript">
      var domReadyQueue = [];
    </script>
  </head>
  <body>
  ...
  <div class="foo"></div>
  <script type="text/javascript">
    domReadyQueue.push(function($){
      $('.foo').doSomething();
    })
  </script>
  ...
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script type="text/javascript">
    jQuery(function(){
      while (domReadyQueue.length) {
        domReadyQueue.shift()(jQuery);
      }
    });
  </script>
  </body>
</html>

Answer 5:

这篇文章要求你的脚本移至底部的理由，是为了让其他文物得到第一次下载。（CSS和图片，这将加快表观渲染次）

这是因为HTTP 1.1建议只下载2项每个主机名。你肯定会想你的CSS要下载的文件，而不是JavaScript中的第一个文件，这可能使该网站似乎呈现慢（只是一个事实，即浏览器还没有得到CSS文件又和一个不肯定它应该与HTML办）

但是，如果你使用谷歌托管的jQuery你那么这将并行下载，否定任何理由将它移动到你的页面的底部。

或者，您可以设置第二个主机托管静态内容（如CSS /脚本/图片）。

但谷歌已经为你做了艰苦的工作，因此它是有道理的，如果它适合使用它。 :-)

Answer 6:

Q - 为什么我经常看到的JavaScript编写/包括一个（X）HTML文档中的关闭体元素之前？
A - DOM元素可以直到浏览器加载HTML元素到DOM不能由JavaScript访问。通过放置的JavaScript在（X）HTML文档（关闭主体元素之前）结束，你将确保脚本只要DOM构建/加载并准备操作调用。这种方法的优点是DOM构造和可能的onload事件将触发之前之后的JavaScript代码被执行。
JavaScript的初学者得到不断通过布置一个操纵DOM在（x）的HTML文档的页眉元素代码绊倒此。这会导致因为DOM尚未构建的错误，因此还没有接触到的JavaScript遍历/操纵DOM。

从Web浏览器中的JavaScript执行和技术的Onload