$(document).ready(function(){})和window.onload=function(){}的比较
这两个函数想必每个前端开发者都不会很陌生,但是很了解用法的人估计就比较少了,博主也是最近才开始注意到这两个函数的区别。
首先$(document).ready(function(){})等同于$().ready(function(){})和$(function(){}),前者貌似在官方文档中不建议使用,具体是为什么我暂时还不清楚,下面先介绍一下这两个函数的用法:用于处理DOM节点加载、图片显示以及动态资源请求。
$(document).ready(function(){...})与window.load执行顺序:$(document).ready(...)是在页面加载完所有DOM节点文档结构和jquery文件加载完成 (不然无法使用$) 后开始执行,window.onload则是在页面加载所有资源后 才开始执行。也就是说window.onload要等到所有图片,外链资源都加载完后才开始执行,也因此window.onload只允许定义一个(实际 是可以定义多个,但只有最后一个有效,相当于前面会被覆盖掉),而$(function(){...})可以允许定义多个,并且按照定义的先后顺序先后执 行。对于大部分应用情况下,$(function(){...})可以说完胜window.onload,因此其执行时间早,用户体验就更好。
另外我还想补充一点 就是在实际使用过程中因为一个js文件中可能出现多个$(document).ready(function(){}),因此要注意在其中定义的变量的作用域只是在该函数体内,并不能跨函数访问。
随机推荐
- Java Se 基础系列(笔记) -- BasicDataType
java.lang.String类代表不可变的字符序列 String类常用方法:1.public char charAt(int index); -- 返回下标为index的字符 2.public i ...
- C#拖动自己的定义标题栏(panel)以及实现窗体拖动关闭和最小化
//没有标题 this.FormBorderStyle = FormBorderStyle.None; //任务栏不显示 this.ShowInTaskbar = false; //实现拖动 1.在窗 ...
- Oracle11g R2学习系列 之三教程选择
工欲善其事必先利其器,选择一本入门教程也是很重要的,本人使用的也是这位同事推荐的电子工业出版社的<<Oracle 实用教程(第3版)>>郑阿奇主编,可以至这里购买到,我个人还是 ...
- hibernate集合映射inverse和cascade详解
hibernate集合映射inverse和cascade详解 1.到底在哪用cascade="..."? cascade属性并不是多对多关系一定要用的,有了它只是让我们在插入或 ...
- CSS的一些思考(一)
迈入前端行业已经8个多月了,从之前懵懵懂懂到现在的能根据设计图迅速成型页面,自我感觉良好.最近看到张大牛的一篇博客<说说CSS学习中的瓶颈>,突然意识到,自己不就处在快速学习和成长后的一个 ...
- 自定义View—绘制基本图形
一.Canvas能够绘制哪些图形 二.
- Jquery各版本下载,附Jquery官网下载方法
jQuery version 2.1.1 http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.1.js http://ajax.aspnetcdn.com ...
- 滚动页面时DIV到达顶部时固定在顶部
本示例使用Javascript实现了滚动页面时,DIV到达顶部时固定在顶部.在IE下效果有点闪,效果网址:http://www.keleyi.com/keleyi/phtml/fixdiv.htm 下 ...
- TypeScript环境搭建
环境搭建 本篇将简单介绍一下TypeScript,并记录开发环境的搭建.使用Visual Studio Code进行一个简单的Demo开发过程. 第一部分.简介 TypeScript是一种由微软开发的 ...
- data mining,machine learning,AI,data science,data science,business analytics
数据挖掘(data mining),机器学习(machine learning),和人工智能(AI)的区别是什么? 数据科学(data science)和商业分析(business analytics ...