原理对比

body.onload(function())是优先将document的DOM渲染,即将页面所有的元素(包括html标签以及所引用到的图片,flash媒体等媒体文件)加载完成,然后再执行页面的脚本;

$(windows).load(function())的加载效果与body.onload(function())是一样的效果;

$(document).ready(function())是优先对文档结构进行加载(不包括图片等非文字媒体文件),即优先加载HTML DOM,然后执行脚本。


★ $(document).ready(function())的实例

<script src="js/jquery-1.7.2.min.js"></script>
<script>
function myFunction() {
$("#test").html("Changed")
}
$(document).ready(myFunction);
/*$(document).ready()是优先对文档结构进行加载(不包含图片等非文字媒体文件),不必等到所有的加载完毕*/
</script> <h1 id="test">Original</h1>

★ $(document).ready(function())的实例2

★ $(window).load(function())的实例

/*$(window).load(function()) 是在页面所有元素(包括html标签以及引用到得所有图片,Flash等媒体)加载完毕后执行的, 与body.onload(function)是一样的执行顺序*/
$(window).load(function () {
alert("Hello");
});
/*设置并列的两个load(function)*/
$(window).load(function () {
alert("see you again!")
})
/*$(window).load(function()) 是在页面所有元素(包括html标签以及引用到得所有图片,Flash等媒体)加载完毕后执行的, 与body.onload(function)是一样的执行顺序*/

body.onload(function())的实例

比较body.onload(function())、$(document).ready(function())与$(windows).load(function)的更多相关文章

  1. window.onload和$(document).ready(function(){})的区别

    前段时间在面试之前查找并整理了一下window.onload和$(document).ready(function(){})区别,今天有时间更到我的博客上,由于本人资历尚浅,如有不对的地方,还请指正. ...

  2. window.onload和$(document).ready()的区别

    window.onload和$(document).ready()的区别,如下表所示   window.onload $(document).ready() 执行时间 在页面所有内容(图片.文件)加载 ...

  3. window.onload 和 $(document).ready()

    一. window.onload 1. 必须等到页面上所有元素(包括图片, JS文件,CSS文件等外部资源)加载完成后才执行 2. window.onload绑定多个函数时,只会执行最后一个 < ...

  4. window.onload和$(document).ready()比较

    浏览器在页面加载完毕后,JS通常使用window.onload方法为DOM元素添加事件,而jQuery使用的是$(document).ready()方法.两者功能相似,但也有细微差异,下面简要对比一下 ...

  5. window.onload和document.ready的区别

    window.onload和document.ready虽然两个方法的运行效果都一样,但他们之间是存在着区别的: 一.从执行的时间 window.onload在dom文档结构加载完毕以后就可以执行,不 ...

  6. 从一个例子了解window.onload、$(function(){})、$(window).load(function(){})的加载顺序

    最近遇到一个轮播需求: 1. ajax请求服务器,返回json,判断json数据里每一项中isFix属性是0还是1,0表示不轮播,1表示需要轮播. 2. 当isFix属性为0的时候,表示该图片不轮播, ...

  7. window.onload()和$(document).ready的区别( $(document).ready == $(function(){ }) )

    首先$(function(){}) 和 $(document).ready(function(){}) 是一个方法,$(function(){})为简写(用的多) $(document).ready和 ...

  8. window.onload 和 $(document).ready(function(){})的区别

    这篇作为我的新的起点开始吧,发现年纪大了,记性就不好了,有些东西老是记了忘,忘了百度.在学一些新知识的时候也是这样的毛病,总是重复学习,这样效率真心差!所以决定开始认真写博客! 本来想封装一个预加载的 ...

  9. $(function(){}) ,$(document).ready(function(){}),window.onload = function(){...},$(window).load(function(){...})区别

    1. 写法:      $(function(){}) ,$(document).ready(function(){})是一样的 2. 时间: window.onload和$(window).load ...

随机推荐

  1. Ques前端组件化体系

    Ques是一套组件化系统,解决如何定义.嵌套.扩展.使用组件. 传统开发模式的痛点 无法方便的引用一个组件,需要分别引用其Javascript.Template.CSS文件 我们期望能以MV*的方式去 ...

  2. 恶心的hadoop集群

    具体配置:网上一堆,我说一下我的问题好了! “完全” 分布式集群 注意地方有三点: 1.你的"master" dfs目录中的某个Id不一致,具体位置,有空我再找找.(经过我找了一下 ...

  3. 手动安装 atom 扩展包 packages

    由于某些原因, 我们下载 atom 扩展时发现速度特别慢, 或者根本无法下载, 那我们可以尝试手动安装 首先, 从 github 上下载(或其它地方) 扩展包, 解压 进入该文件夹, 找到 packa ...

  4. ORACLE 10g下载地址

    ORACLE 10g下载地址 oracle 下载还需要用户名我自己注册了个方便大家使用下载 密码是这个 一般不会动了 大家也不用帮我找回密码了 每次都改 也很麻烦的如果有需要可以帮我浏览下 右侧的需要 ...

  5. POJ1226:Substrings(后缀数组)

    Description You are given a number of case-sensitive strings of alphabetic characters, find the larg ...

  6. Spring源码追踪4——SpringMVC View解析

    这次的议题是返回json和返回普通view经过的路线差异. ---------------------------------------------------------------------- ...

  7. android学习者优秀网址推荐

    非常漂亮的android UI库集合,别人整理的,如果感觉不错,赶快收藏吧!! https://github.com/wasabeef/awesome-android-ui https://githu ...

  8. wait、notify、notifyAll的阻塞和恢复

    前言:昨天尝试用Java自行实现生产者消费者问题(Producer-Consumer Problem),在coding时,使用到了Condition的await和signalAll方法,然后顺便想起了 ...

  9. WPF自定义控件

    一.ImageButton 1.继承ImageButtonButton,添加依赖属性 using System; using System.Windows; using System.Windows. ...

  10. CSS基础(七):z-index详解

    概念 z-index 属性设置元素的堆叠顺序.拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面. 层级关系的比较 1. 对于同级元素,默认(或position:static)情况下文档流后面的 ...