window.onload和$(docunment).ready的区别
浏览器加载完DOM后,会通过javascript为DOM元素添加事件,在javascript中,通常使用window.onload()方法。
在jquery中,则使用$(document).ready()方法。下面介绍一下两者的区别。
1.执行时机
window.onload :必须在页面所有元素(包括图片,引用文件)加载完后执行。。
$(document).ready() :是页面中所有HTML DOM,CSS DOM结构加载完之后就会执行,其他图片可能没有加载完。
如果想要网页所有内容(包括图片等)加载完毕,再注册事件,使用$(window).load(function);等价于window.onload()。
2.编写个数不同
window.onload :不能同时写多个,后面的将会覆盖前面的。
$(document).ready() :可以同时编写多个,并且都可以得到执行。
3.简化写法
window.onload :无。
$(document).ready() :
$(document).ready(function(){
//to do;
});
$().ready(function(){ //$()不带参数默认是document
//to do;
});
$(function(){
//to do;
});
最后附上一段在所有DOM元素加载之前执行的jQuery代码
<script type="text/javascript">
(function() {
alert("DOM还没加载哦!");
})(jQuery)
</script>
window.onload和$(docunment).ready的区别的更多相关文章
- window.onload和$(document).ready()的区别
window.onload和$(document).ready()的区别,如下表所示 window.onload $(document).ready() 执行时间 在页面所有内容(图片.文件)加载 ...
- window.onload 与 $(document).ready() 的区别
以浏览器装载文档为例,在页面加载完毕后,浏览器会通过 JavaScript 为 DOM 元素添加事件.在常规的 JavaScript 代码中,通常使用 window.onload 方法 ,而在 jQu ...
- window.onload和document.ready的区别
window.onload和document.ready虽然两个方法的运行效果都一样,但他们之间是存在着区别的: 一.从执行的时间 window.onload在dom文档结构加载完毕以后就可以执行,不 ...
- 浏览器加载模式:window.onload和$(document).ready()的区别(详解)
jQuery库文件是在body元素之前加载的,必须等待所有的DOM元素加载后,延迟支持DOM操作,否则就无法获取到. 在延迟等待加载,JavaScript提供了一个事件为load,方法如下: wind ...
- window.onload与$(document).ready()的区别
对于很多初学者来说,window.onload出现在代码中的频率非常高,这似乎变成了一种习惯,可是并不知道具体为什么要加这句代码,可以做几个试验对比: 实验一: <script> docu ...
- 【jQuery】window.onload 和 $(document).ready() 的区别
... 在Stack Overflow上看到了这个问题,自己翻译了过来. The onload event is a standard event in the DOM, while the read ...
- window.onload与document.ready的区别
1. window.onload必须等到网页中所有的内容加载完(包含图片)才执行 document.ready网页中所有DOM结构绘制完执行,可能DOM并没有加载完 所有document.ready比 ...
- window.onload与$(document).ready()之区别
1.执行时间 window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行. $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕. 2 ...
- window.onload()和$(document).ready的区别( $(document).ready == $(function(){ }) )
首先$(function(){}) 和 $(document).ready(function(){}) 是一个方法,$(function(){})为简写(用的多) $(document).ready和 ...
随机推荐
- testlink迁移
前置配置:安装mysql-5.5.13-win32版数据库(速度快点),设置root密码为123465(mysql5.5数据库端口号不要与redmine的mysql冲突) 1.安装testlink(版 ...
- UiAutomator编译与运行测试代码
编译与运行步骤 1.创建build文件.打开cmd命令窗口,进入工程路径cd E:\workspace\UiAutomatorDemo1,然后输入命令android create uitest-pro ...
- Java多线程与并发——生产者与消费者应用案例
多线程的开发中有一个最经典的操作案例,就是生产者-消费者,生产者不断生产产品,消费者不断取走产品. package com.vince; /** * 生产者与消费者案例 * @author Admin ...
- Echarts同一页面多个图表自适应浏览器窗口大小——window.onresize
当前做的一个项目中,频繁使用到百度团队的Echarts,发在一个页面同时出现多个图表时,只有最后一个图表触发了window.onresize事件,查询官方文档后得到解决. 方法如下: hwChart. ...
- 合理设置apache httpd的最大连接数--linux
手头有一个网站在线人数增多,访问时很慢.初步认为是服务器资源不足了,但经反复测试,一旦连接上,不断点击同一个页面上不同的链接,都能迅速打开,这种现象就是说明apache最大连接数已经满了,新的访客只能 ...
- webpack.config.js====配置babel
参考:https://www.jianshu.com/p/9808f550c6a91. 安装依赖babel-loader: 负责 es6 语法转化babel-preset-env: 包含 es6.7 ...
- Spring cloud Eureka 服务治理(高可用服务中心)
在微服务的架构中,我们考虑发生故障的情况,所以在生产环境中我们需要对服务中各个组件进行高可用部署. Eureka Server 的高可用实际上就是将自己作为服务想其它服务注册中心注册自己,这样就形成了 ...
- vs2013安装时提示核心功能错误
VS核心功能安装时发生严重错误:解决办法:计算机管理->设备管理器->非即插即用驱动程序->http改为自动.
- windows mysql忘记密码解决方案
因为mysql很久之前装的,今天突然想用的时候发现密码不记得,怎一个尴尬了得,所以没办法,只能修改一个新的密码. 在此过程中遇到了几个问题 1.没法进入数据库: 2.修 ...
- draggable与overflow同时存在,无法拖拽出父元素问题解决
在使用jquery-ui的拖拽功能对列表内的选项拖拽时,发现无法将选项拖拽出列表的范围,一出范围就自动隐藏在列表下,查找到最后的原因是css中的overflow的原因,overflow存在则不能将选项 ...