$(window).load(function() {})和$(document).ready(function(){})的区别
JavaScript 中的以下代码 :
Window.onload
= function (){// 代码 }
等价于
Jquery 代码如下:
$(window).load(function
(){// 代码 });
$(function(){})等价于 $(document).ready(function(){});
$(function(){})是 $(document).ready(function(){})的简写
执行时机
window.load——必须等待网页中所有的内容加载完毕后 ( 包括图片 ) 才能执行
$(window).load(function (){// 代码
}); ——必须等待网页中所有的内容加载完毕后 ( 包括图片 ) 才能执行
$(document).ready()——网页中所有
DOM 结构绘制完毕后就执行,可以能 DOM 元素关联的内容并没有加载完
编写个数
window.load——不能同时编写多个以下代码无法正确执行:
window.onload
= function(){ alert(“text1”);};window.onload = function(){ alert(“text2”);};结果只输出第二个
注意:JavaScript的onload事件一次只能保存对一个函数的引用,他会自动用最后面的函数覆盖前面的函数。因为window.load是DOM2级事件,而$(window).load(function (){// 代码 });可以使用多次,只是前后执行,因为用的是DOM3级事件。
$(document).ready()——能同时编写多个以下代码正确执行:
$(document).ready(function(){
alert(“Hello World”);});$(document).ready(function(){ alert(“Hello again”);});
结果两次都输出
以 浏览器装载文档为例,在页面加载完毕后,浏览器会通过 Javascript 为 DOM 元素添加事件。在常规的 Javascript 代码中,通常使用 window.onload 方法,而在 Jquery 中,使用的是$(document).ready() 方法。 $(document).ready() 方法是事件模块中最重要一个函数,可以极大的提高Web
应用程序的速度。
另外,需要注意一点,由于在 $(document).ready()
方法内注册的事件,只要 DOM 就绪就会被执行,因此可能此时元素的关联文件未下载完。
例如与图片有关的 html 下载完毕,并且已经解析为 DOM 树了,但很有可能图片还没有加载完毕,所以例如图片的高度和宽度这样的属性此时不一定有效。要解决这个问题,可以使用 Jquery 中另一个关于页面加载的方法 ---load() 方法。
Load() 方法会在元素的onload 事件中绑定一个处理函数。
如果处理函数绑定给 window 对象,则会在所有内容 ( 包括窗口、框架、对象和图像等 ) 加载完毕后触发,如果处理函数绑定在元素上,则会在元素的内容加载完毕后触发。
随机推荐
- JavaScript 开发者经常忽略或误用的七个基础知识点(转)
JavaScript 本身可以算是一门简单的语言,但我们也不断用智慧和灵活的模式来改进它.昨天我们将这些模式应用到了 JavaScript 框架中,今天这些框架又驱动了我们的 Web 应用程序.很多新 ...
- 总结CSS3新特性(Transform篇)
概述: CSS3新添加的Transform可以改变元素在可视化区域的坐标(这种改变不会引起文档的重排,只有重排),以及形状,还有些3D形变.结合 Animation(这里以后会有个链接的) 能实现酷炫 ...
- 数据连接到 Web 服务 InfoPath 2010 窗体中的 SharePoint 服务器上运行时的错误消息:"401-未经授权"解决方案
症状: 请考虑以下情形: Web 窗体发布到 SharePoint 服务器. 您创建 Microsoft InfoPath 2010 表单所在的 SharePoint 服务器上使用到位于数据的数据连接 ...
- SharePoint Online 创建门户网站系列之图片滚动
前 言 创建SharePoint Online栏目我们之前已经介绍过了,具体就是内容编辑器方式.自带WebPart方式和JavaScript读取后台数据前台做展示的三种: 但是,对于复杂的展示来说,这 ...
- SharePoint 2013 配置HTTPS(SSL)
1.打开服务器上的IIS,找到服务器证书,如下图: 2.进入服务器证书,点击右侧操作“创建自签名证书”,如下图: 3.为证书指定一个好记名称,存储选择个人,如下图: 4.点击确定以后,服务器证书页面, ...
- java使用动态代理来实现AOP(日志记录)
以下内容为原创,转载时请注明链接地址:http://www.cnblogs.com/tiantianbyconan/p/3336627.html AOP(面向方面)的思想,就是把项目共同的那部分功能分 ...
- git stash提交PR的正确步骤&git squash技术
1.git stash梳理 1.1git stash的克隆与同步 首先整理下git stash的逻辑是这样 在本地做出了新的修改,提交时显示当前的版本不是最新版本,这时就需要先pull一下自己代码仓库 ...
- 我的BluetoothChat示例源码阅读笔记
BluetoothChat核心类BluetoothChatService,该类用于管理与其他设备的蓝牙连接和设置.该类包含AcceptThread.ConnectedThread.ConnectThr ...
- Android 应用程序的反编译
1.ApkTool工具 安装ApkTool工具,该工具可以解码得到资源文件,但不能得到Java源文件.安装环境:需要安装JRE1.61> 到http://code.google.com/p/an ...
- 设计模式 之 观察者(Observer)模式
观察者(observer)模式定义了一对多的依赖关系,让多个观察者对象能够同时监听某一主题对象.这个主题对象中的状态发生改变时,就会通知所有的观察者对象. 观察者模式的结构图: 结构中各个部分的含义: ...