zoukankan      html  css  js  c++  java
  • $(document).ready() 与window.onload的差别

         近期项目中要做一个消息提醒功能,用户登录完毕后,从右下角滑出一个消息模块,类似qq弹出的广告,只是是在浏览器中的,更大了一些而已。
         開始的做法是在$(document).ready()中使用的是jQuery的slideDown展示消息div,因为页面里面有六七个块是iframe,每一个iframe载入时间都比較长。内容也比較多,结果iframe没载入完,消息div就出来了,并且动画一卡卡的,效果实在无法忍受。
         后来在jQuery官网上的一片文章http://learn.jquery.com/about-jquery/how-jquery-works/发现jQuery的$(document).ready()不是等页面所有载入完再运行的,而是当前页面的dom载入完成后就运行了,这样效率非常高,速度也快。只是要想等页面所有载入完,包含内部的iframe都载入完再运行,就还要使用window.onload事件了,以下说说window.onload和$(document).ready()两者的差别。
         主要是运行时间不同,上面也说了window.onload必须等到页面内包含图片,iframe等全部元素载入完成后才干运行。而$(document).ready()是DOM结构绘制完成后就运行,不必等到载入完成。也就是说运行时可能图片还没完成下载。iframe内容没载入完成等。

         两者的运行时间不同。作用也不同。绝大部分情况下$(document).ready()的作用要好一些,可是要注意的是由于$(document).ready()运行时可能图片等内容没载入完。要想获取图片尺寸这类属性不一定有效。

    可是等所有页面都载入完再获取某个图片的尺寸。又浪费了时间,怎么办呢?好在jQuery给我们提供了一个更好的办法,能够使用load方法给指定元素绑定载入完毕时的事件。如$("img").load(function(){……});

         load方法另一个优点。假设单纯的写window.onload注冊事件的话仅仅会运行最后一个,假设要注冊多个。须要额外的代码来推断,而使用jQuery的load方法能够注冊多个事件,$(window).load()和window.onload是等效的,可是load方法能够注冊多个事件。



  • 相关阅读:
    用于主题检测的临时日志(594fb726-af0b-400d-b647-8b1d1b477d72
    返璞归真vc++之字符类型
    DIV居中
    程序员职业生涯
    枚举进程句柄
    不使用mutex设计模式解决并发访问cache
    服务器权重分配算法
    xmemecached中的一致性hash算法
    安卓课堂练习
    pythonPTA---分支循环与集合7-1 jmu-python-韩信点兵 (20分) 7-2 打印数字矩形 (10分) 7-3 成绩统计 (10分) 7-4 找列表中最大元素的下标 7-5 删除列表中的重复值
  • 原文地址:https://www.cnblogs.com/wgwyanfs/p/6843934.html
Copyright © 2011-2022 走看看