JQUERY的$(function(){})和window.onload=function(){}的区别
在Jquery里面,我们知道入口函数有两种写法:$(function(){}) 和$(document).ready(function(){})
作用类似于传统JavaScript中的window.onload方法,不过与window.onload方法还是有区别的。
重点内容
1.执行时间
1 window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。
2 $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕。
2.编写个数不同
1 window.onload不能同时编写多个,如果有多个window.onload方法,只会执行一个
2 $(document).ready()可以同时编写多个,并且都可以得到执行
3.简化写法
1 window.onload没有简化写法
2 $(document).ready(function(){})可以简写成$(function(){});
由于在 $(document).ready() 方法内注册的事件,只要 DOM 就绪就会被执行,因此可能此时元素的关联文件未下载完。例如与图片有关的 html 下载完毕,并且已经解析为 DOM 树了,但很有可能图片还没有加载完毕,所以例如图片的高度和宽度这样的属性此时不一定有效。要解决这个问题,可以使用 Jquery 中另一个关于页面加载的方法 —load() 方法。 Load() 方法会在元素的 onload 事件中绑定一个处理函数。如果处理函数绑定给 window 对象,则会在所有内容 ( 包括窗口、框架、对象和图像等 ) 加载完毕后触发,如果处理函数绑定在元素上,则会在元素的内容加载完毕后触发。
Jquery 代码如下:
$(window).load(function (){
// 编写代码
});等价于 JavaScript 中的以下代码
Window.onload = function (){
// 编写代码
}
JQUERY的$(function(){})和window.onload=function(){}的区别的更多相关文章
- JQUERY的$(function(){})和window.onload=function(){}的区别【转】
在Jquery里面,我们知道入口函数有两种写法:$(function(){}) 和$(document).ready(function(){}) 作用类似于传统JavaScript中的window.o ...
- $(document).ready(function(){}) 与 window.onload = function(){} 区别
$(document).ready(fucntion(){ //在页面dom结构加载完毕后执行代码, }) window.onload = function(){ //页面所有内容加载完毕后,执行代码 ...
- $(document).ready(function(){})和window.onload=function(){}的比较
这两个函数想必每个前端开发者都不会很陌生,但是很了解用法的人估计就比较少了,博主也是最近才开始注意到这两个函数的区别. 首先$(document).ready(function(){})等同于$(). ...
- $(function(){}) ,$(document).ready(function(){}),window.onload = function(){...},$(window).load(function(){...})区别
1. 写法: $(function(){}) ,$(document).ready(function(){})是一样的 2. 时间: window.onload和$(window).load ...
- 从一个例子了解window.onload、$(function(){})、$(window).load(function(){})的加载顺序
最近遇到一个轮播需求: 1. ajax请求服务器,返回json,判断json数据里每一项中isFix属性是0还是1,0表示不轮播,1表示需要轮播. 2. 当isFix属性为0的时候,表示该图片不轮播, ...
- js常见执行方法window.onload = function (){},$(document).ready()
1. window.onload = function(){}; 当页面DOM对象加载完毕,web浏览器能够运行JS时,此方法即被触发. 2. $(document).ready();当web页面以及 ...
- 页面加载之window.onload=function(){} 和 $(function(){})的区别
通用的页面加载js有四种方式: 1.window.onload = function(){}; —-js 2.$(window).load(function(){});——Jquery 3.$(doc ...
- window.onload=function(){}和$(function(){})的区别
1.执行的个数的不同: window.onload()只会执行最后一个,些多个也会被最后一个覆盖. $(function(){})可以写多个,也会执行多个,按照从上至下的顺讯执行 2.执行时间上的不同 ...
- jq的$(function(){})与window.onload的区别
最近一直在研究jq的源码,书写jq的代码我们通常会包裹在一个$(function(){})函数中,jq的$(function(){})也就是$(document).ready(function(){} ...
随机推荐
- deep_learning_MNIST数据集
Code_link:https://pan.baidu.com/s/1dshQt57196fhh67F8nqWow 本文是为既没有机器学习基础也没了解过TensorFlow的码农.序媛们准备的.如果已 ...
- getAttribute和getParameter的简单区别
getAttribute表示从request范围取得设置的属性,必须要先setAttribute设置属性,才能通过getAttribute来取得,设置与取得的为Object对象类型 getParame ...
- linux crontab 定时任务执行
cron机制 cron可以让系统在指定的时间,去执行某个指定的工作,我们可以使用crontab指令来管理cron机制 crontab参数 -u:这个参数可以让我们去编辑其他 ...
- 无法连接Web 的 IIE 问题
我一个解决方案里有两个项目在一块,其中一个就突然凉凉了 然后在网上找了很多,基本都是删除vs文件,在启动,幸运的是,并没什么用. 最后我用了这个: 打开Visual Studio, 右键单击网站 &g ...
- 观察数组 -vue
1.vue中的被包装的观察数组能够触发视图更新 2.有push(),pop(),shift(),unshift(),splice(),sort(),reverse() 3.不能检测到下面数组变化: 1 ...
- docker安装rocketmq
一.单机部署 1.拉取镜像:foxiswho/rocketmq:server cabel/rocketmq:broker styletang/rocketmq-console-ng 2.创建目录:d ...
- IDEA 使用LiveEdit插件
第一步: 第二步: 第三步: 第四步: 等待下载完成 第五步: 第六步: 第七步: 配置tomcat时注意选择chrome浏览器,并勾选右边的多选框 完成之后,就可以启动项目了,然后可以改变html代 ...
- Java之ExceptionHelper工具类
import java.util.Map; import org.apache.commons.lang3.StringUtils; import org.apache.commons.lang3.e ...
- Acwing-169-数独2(搜索, 剪枝)
链接: https://www.acwing.com/problem/content/171/ 题意: 请你将一个16x16的数独填写完整,使得每行.每列.每个4x4十六宫格内字母A~P均恰好出现一次 ...
- Spring Security 解决X-Frame-Options deny
错误信息: Refused to display 'https://github.com/hwclass/awesome-sound' in a frame because it set 'X-Fra ...