添加setTimeout JavaScript / jQuery函数可以帮助更快地加载页面

Question

下面的JavaScript是否允许网页加载与标准函数相比更快或$(window).load(function(){或$(document).ready()如果没有办法允许页面加载然后运行JavaScript？

setTimeout(function(){
// JavaScript OR jQuery to execute
}, 5000);

Answer 1

描述

$(document).ready()指定DOM完全加载时要执行的函数。

该函数确保加载所有html元素（DOM）。因此，使用setTimeout不是一个好主意，因为您无法知道浏览器是否在此时构建了DOM。

您可以将JavaScript作为文档的末尾，以确保浏览器已构建DOM，但这不是您在使用jQuery时应该这样做的方式。

更多信息

DOM表示文档对象模型

  

文档对象模型（DOM）是一种跨平台且与语言无关的约定，用于表示HTML，XHTML和XML文档中的对象并与之交互。 DOM的各方面（例如其“元素”）可以在使用的编程语言的语法内被寻址和操纵。 DOM的公共接口在其应用程序编程接口（API）中指定。

以下函数在jQuery中是相同的（重载）。

$(function() 
{
  // DOM is loaded
});

$(document).ready(functions() {
  // DOM is loaded
});

// this is the best way if you want prevent collisions with other JavaScript librarys
jQuery(document).ready(function($) {
  // DOM is loaded
});

- jQuery Documentation - .ready()

- Wikipedia - Document Object Model

Answer 2

首先，在结束</body>标记之前，在HTML的最底部放置对页面构造不重要的任何JavaScript。这包括引用外部.js文件的任何脚本标记。

接下来，如果你正在使用jQuery（我希望你是），那么在这个方法中插入你需要的任何JS逻辑：

$(document)ready(function(){
     //do stuff
});

最后，对于旧学校JS，你想把它添加到你的身体标签：

onload="YourFunctionName()"

Answer 3

除非你用JS做一些大规模的计算，否则没有。大部分“加载”时间都花在下载资源上，而不是在页面上绘制/渲染它们。如果您有任何发送其他httprequests（ajax）的代码，以及在页面加载完成之前触发的代码，那么您需要以某种方式使用onload方法。或者只是按照clyfe的说法把它放在底部。