JS JQ 页面加载顺序方法的区别

document.ready和onload的区别——JavaScript文档加载完成事件
页面加载完成有两种事件
一是ready，表示文档结构已经加载完成（不包含图片等非文字媒体文件）
二是onload，指示页面包含图片等文件在内的所有元素都加载完成。

用jQ的人很多人都是这么开始写脚本的：
$(function(){
// do something
});
其实这个就是jq ready()的简写，他等价于：

$(document).ready(function(){
//do something
})
//或者下面这个方法，jQuer的默认参数是：“document”；

$().ready(function(){
//do something
})
这个就是jq ready()的方法就是Dom Ready，他的作用或者意义就是:在DOM加载完成后就可以可以对DOM进行操作。
一般情况先一个页面响应加载的顺序是：域名解析-加载html-加载js和css-加载图片等其他信息。
那么Dom Ready应该在“加载js和css”和“加载图片等其他信息”之间，就可以操作Dom了。

1.window.onload方法

⑴执行时机:
在网页中所有元素(包括元素的所有关联文件)完全加载到浏览器后才执行，即JavaScript 此时可以访问网页中的所有元素。
window.οnlοad=function(){ $(window).load(function(){
//编写代码等价于 //编写代码
} });

⑵多次使用:
JavaScript的onload事件一次只能保存对一个函数的引用，他会自动用最后面的函数覆盖前面的函数。
function one(){

alert("one");

}

function two(){

alert("two");

}

window.οnlοad=one;

window.οnlοad=two;

//运行代码后只有 two

2.$(document).ready()方法

⑴执行时机:在DOM完全就绪时就可以被调用。(这并不意味着这些元素关联的文件都已经下载完毕)
举个例子:$(document).ready()方法明知要DOM就绪就可以操作了，不需要等待所有图片下载完毕。

⑵多次使用:
function one(){

alert("one");

}

function two(){

alert("two");

}

$(document).ready(function(){

one();

});

$(document).ready(function(){

two();

});

//运行代码后

//先是：one

//先是：two

转载于:https://www.cnblogs.com/Aaron-lu/p/9213947.html

JS JQ 页面加载顺序方法的区别相关推荐

vue 加载页面时触发时间_详解Vue.js在页面加载时执行某个方法
详解Vue.js在页面加载时执行某个方法 jQuery中可以这样写 vue中,如果要达到相同效果,可以使用vue的生命周期函数,如create或者mounted 附上vue.js的生命周期函数执行流程 ...
关于js css html加载顺序整理
参考原文豆豆蛙:关于js css html加载顺序整理 1.js放在head中会立即执行,阻塞后续的资源下载与执行.因为js有可能会修改dom,如果不阻塞后续的资源下载,dom的操作顺序不可控. 正 ...
HTML页面加载顺序
HTML页面加载顺序,这个过程发生了什么浏览器网络拉取资源是多线程的.但是dom树的操作都是在一个线程中的.所以网页资源的解析和js加载执行,以及dom树渲染都是一个线程执行.一个线程的任务就会相互 ...
html加载状态,js等待页面加载完成
页面加载完成后等待一段时间在执行js的方法,时间例如方法: function test(){return 1;} 页面加载完毕事件: window.onload = function(){ setTi ...
JS判断页面加载完毕
//JS判断页面加载完毕,再隐藏加载效果层,一个简单的JS加载效果.document.onreadystatechange = function () {if (document.readyState ...
解决JS文件页面加载时的阻塞
关于页面加载时的时间消费,许多书中都做出了介绍,也提出了很多种方法.本文章就详细介绍XHR注入. 概述:JS分拆的方法 1.XHR注入:就是用ajax异步请求同域包含脚本的文件,然后将返回的字符串转化 ...
java加快页面加载速度方法_关于页面加载速度优化的11种方法
1.合并js和css文件将js和css分别合并到一个共享文件,这样不仅能够简化代码,而且在执行js文件是,如果js文件较多,就需要多次向服务器请求数据,这样将会延长加载速度,将js文件合并在一起,减 ...
关于第三方接口支付的时候采用post提交的方式，有两种一种是通过 curl来进行，一种是通过js当页面加载完后跳转...
这是第一种.通过javascript页面加载完后,对表单采用 post方式提交给第三方接口----- echo <<<_END <!DOCTYPE html PUBLIC & ...
关于页面加载的方法收集
例http://loo2k.com/blog/demo/loadingbar2.html 完美的 jQuery 网页进度条 2010-05-05 by loo2k 「前端开发」给自己的博客加上一个 ...

JS JQ 页面加载顺序方法的区别

JS JQ 页面加载顺序方法的区别相关推荐

最新文章

热门文章