window.load 和$(document).ready() 、window.load和body onload区别
1.执行时间
window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。
$(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕。
2.编写个数不同
window.onload不能同时编写多个,如果有多个window.onload方法,只会执行一个
$(document).ready()可以同时编写多个,并且都可以得到执行
以下代码无法正确执行:
window.onload = function(){
alert(“text1”);
};
window.onload = function(){
alert(“text2”);
};
结果只输出第二个 能同时编写多个
以下代码正确执行:
$(document).ready(function(){
alert(“Hello World”);
});
$(document).ready(function(){
alert(“Hello again”);
});
结果两次都输出
3.简化写法
window.onload没有简化写法
$(document).ready(function(){})可以简写成$(function(){});
另外,需要注意一点,由于在 $(document).ready() 方法内注册的事件,只要 DOM 就绪就会被执行,因此可能此时元素的关联文件未下载完。例如与图片有关的 html 下载完毕,并且已经解析为 DOM 树了,但很有可能图片还没有加载完毕,所以例如图片的高度和宽度这样的属性此时不一定有效。要解决这个问题,可以使用 Jquery 中另一个关于页面加载的方法 ---load() 方法。 Load() 方法会在元素的 onload 事件中绑定一个处理函数。如果处理函数绑定给 window 对象,则会在所有内容 ( 包括窗口、框架、对象和图像等 ) 加载完毕后触发,如果处理函数绑定在元素上,则会在元素的内容加载完毕后触发。
Jquery 代码如下:
$(window).load(function (){
// 编写代码
});等价于 JavaScript 中的以下代码
Window.onload = function (){
// 编写代码
}
window.load和body onload的区别参考:https://blog.csdn.net/Myair_AC/article/details/77839255
window.load 和$(document).ready() 、window.load和body onload区别的更多相关文章
- JQ中$(window).load和$(document).ready区别与执行顺序
JQ中的$(document).ready()大家应该用的非常多,等同于$(function(){}),基本每个JS脚本中都有这个函数的出现有时甚至会出现多个,那么另一个加载函数$(window).l ...
- $(window).load与$(document).ready的区别
刚好今天学了用jQuery实现瀑布流的用法,但加载时发现了一个小小的问题,那就是分别用$(window).load与$(document).ready实现加载时,$(document).ready的布 ...
- $(window).load()和$(document).ready()
一.前言 我们在编写前端代码的js文件时,往往是会先写一个$(function(){}),然后才会在大括号里面继续写我们自己的代码.当时并不能理解为什么要添加这样一个东西,只是把它当做一个标签一样添加 ...
- [转]JQ中$(window).load和$(document).ready区别与执行顺序
一.$(window).load().window.onload=function(){}和$(document).ready()方法的区别 1.$(window).load() 和window.on ...
- jq方法中 $(window).load() 与 $(document).ready() 的区别
通过自学进入了前端的行列,只知道在js中,一开头就写一个: window.onload = function(){ //doing sth} 然后所有的乱七八糟的代码全塞里面,大概知道window.o ...
- $(document).ready,$(window).load,window.onload区别和联系
$(document).ready是在dom结构加载完毕就执行. $(window).load 等价于window.onload,必须等到页面内包括图片的所有元素加载完毕后才能执行. $(docume ...
- $( document ).ready()&$(window).load()
$( document ).ready() https://learn.jquery.com/using-jquery-core/document-ready/ A page can't be man ...
- window.load 和$(document).ready() 区别
1.执行时间 window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行. $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕.2.编写个数不同 w ...
- jQuery中的$(window).load()与$(document).ready()以及jquery $(document).ready() 与window.onload的区别
大多数jQuery实例或教程都告诉我们绑定我们的jQuery代码到$(document).ready事件.虽然$(document).ready 事件在大多数情况下都OK,但是它的解析顺序是在文档准备 ...
随机推荐
- 数据库中的html在页面上显示
在ASP页面中,动态显示html格式的数据的方法如下: .aspx文件: <div id="divBox" runat="server"></ ...
- json和java bean的相互转换(使用fastjson)
<dependency> <groupId>com.alibaba</groupId> <artifactId>fastjson</artifac ...
- UI5-文档-4.25-Sorting and Grouping
为了使我们的发票列表更加用户友好,我们将它按字母顺序排序,而不是仅仅显示来自数据模型的顺序.此外,我们还引入了组,并添加了发布产品的公司,以便更容易使用数据. Preview The list is ...
- vue基础——列表渲染
列表渲染 用 v-for 把一个数组对应为一组元素 我们用 v-for 指令根据一组数组的选项列表进行渲染.v-for 指令需要使用 item in items 形式的特殊语法, items 是源数据 ...
- WP8.1 页面跳转,overwrite后退键
In 8.1 we use the below code to navigate between pages: this.Frame.Navigate(typeof(PivotPage)); In 8 ...
- Zuul超时问题,微服务响应超时,zuul进行熔断
天碰到了微服务响应超时问题,而且超时时间特别短,2秒就超时,zuul就走熔断了. 我采用zuul作为网关,根据不同的访问路径进行微服务的路由,譬如有个服务是user,我访问user服务的某个接口时,该 ...
- The 2018 Nobel prizesThe Nobel prize for economics is awarded for work on the climate and economic growth
The 2018 Nobel prizesThe Nobel prize for economics is awarded for work on the climate and economic g ...
- layoutSubviews相关总结
ios layout机制相关方法 - (CGSize)sizeThatFits:(CGSize)size - (void)sizeToFit ------- - (void)layoutSubview ...
- Python itertools/内置函数
https://docs.python.org/3.5/library/itertools.html#itertools.starmap // https://docs.python.org/3.5/ ...
- XX-net 部署网络
https://github.com/XX-net/XX-Net/wiki/%E4%BD%BF%E7%94%A8Chrome%E6%B5%8F%E8%A7%88%E5%99%A8 主要步骤有三步:安装 ...
