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

$(document).ready和window.onload都是在都是在页面加载完执行的函数,大多数情况下差别不大,但也是有区别的。

$(document).ready:是DOM结构绘制完毕后就执行,不必等到加载完毕。 意思就是DOM树加载完毕,就执行,不必等到页面中图片或其他外部文件都加载完毕。并且可以写多个.ready

window.onload:是页面所有元素都加载完毕,包括图片等所有元素。只能执行一次。


所以,$(document).ready的执行时间要早于window.onload。并且可以写多个,看代码:

 1 //以下代码无法正确执行:
2 window.onload = function()
3 {
4 alert(“text1”);
5 };
6 window.onload = function()
7 {
8 alert(“text2”);
9 };
10 //结果只输出第二个 能同时编写多个
11 //以下代码正确执行:
12 $(document).ready(function()
13 {
14 alert(“Hello World”);
15 });
16 $(document).ready(function()
17 {
18 alert(“Hello again”);
19 });
20 //结果两次都输出

如果需要获取DOM绑定元素的属性值时,最好使用window.onload,因为他是在所有元素加载完毕才执行,如果使用$(document).ready,DOM已经加载,但是DOM绑定的元素属性没有加载,所以属性不生效。要解决这个问题,可以使用 Jquery 中另一个关于页面加载的方法 ---load() 方法。 Load() 方法会在元素的 onload 事件中绑定一个处理函数。如果处理函数绑定给 window 对象,则会在所有内容 ( 包括窗口、框架、对象和图像等 ) 加载完毕后触发,如果处理函数绑定在元素上,则会在元素的内容加载完毕后触发。

//Jquery 代码如下:
$(window).load(function ()
{ });
//等价于 JavaScript 中的以下代码
Window.onload = function ()
{ }

window.onload()和$(document).ready的区别( $(document).ready == $(function(){ }) )的更多相关文章

  1. window.onload和$(docunment).ready的区别

    浏览器加载完DOM后,会通过javascript为DOM元素添加事件,在javascript中,通常使用window.onload()方法. 在jquery中,则使用$(document).ready ...

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

    以浏览器装载文档为例,在页面加载完毕后,浏览器会通过 JavaScript 为 DOM 元素添加事件.在常规的 JavaScript 代码中,通常使用 window.onload 方法 ,而在 jQu ...

  3. window.onload与$(document).ready()的区别

    对于很多初学者来说,window.onload出现在代码中的频率非常高,这似乎变成了一种习惯,可是并不知道具体为什么要加这句代码,可以做几个试验对比: 实验一: <script> docu ...

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

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

  5. 【jQuery】window.onload 和 $(document).ready() 的区别

    ... 在Stack Overflow上看到了这个问题,自己翻译了过来. The onload event is a standard event in the DOM, while the read ...

  6. JS点击任意标签获得该标签属性,以获得ID为例,以及AJAX的异步原理和 $(document).ready()与window.onload加载方法的区别

    js代码: //$(document).click(function (e) { // 在页面任意位置点击而触发此事件 // var select = ""; // var i = ...

  7. window.onload与document.ready的区别

    1. window.onload必须等到网页中所有的内容加载完(包含图片)才执行 document.ready网页中所有DOM结构绘制完执行,可能DOM并没有加载完 所有document.ready比 ...

  8. jQuery中的$(window).load()与$(document).ready()以及jquery $(document).ready() 与window.onload的区别

    大多数jQuery实例或教程都告诉我们绑定我们的jQuery代码到$(document).ready事件.虽然$(document).ready 事件在大多数情况下都OK,但是它的解析顺序是在文档准备 ...

  9. window.onload与$(document).ready()之区别

    1.执行时间 window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行.         $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕. 2 ...

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

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

随机推荐

  1. Linux超全实用指令大全

    参考 Linux超全实用指令大全

  2. Oracle 10046 event

    http://czmmiao.iteye.com/blog/1497509 10046事件概述Oracle的10046事件,可以跟踪应用程序所执行的SQL语句,并且得到其解析次数.执行次数,CPU使用 ...

  3. codeforces 722F - Cyclic Cipher

    题目链接:http://codeforces.com/problemset/problem/722/F ------------------------------------------------ ...

  4. Firefox,Chrome使用

    Firefox 插件 REDIRECTOR Automatically redirect pages based on user-defined rules. 根据用户定义的规则自动重定向页面的插件. ...

  5. 《图解设计模式》读书笔记9-2 Proxy模式

    目录 Proxy模式 示例程序 程序描述 类图 程序 角色和类图 角色 模式类图 思路拓展 提升速度 代理与委托 Http代理 与其他模式的关联 Decorator模式 Proxy模式 Proxy是代 ...

  6. Components controls 区别

    http://www.cnblogs.com/del/archive/2008/10/23/1317862.html 一个容器控件如果被其他控件指定为属主(Owner), 那么它的 Component ...

  7. python+selenium元素定位之CSS学习01

    参考文档:https://www.w3school.com.cn/cssref/css_selectors.asp 选择器 例子 例子描述 CSS .class .intro 选择 class=&qu ...

  8. ntp局域网时间同步操作

    需求:局域网里面有两台电脑需要同步时间 一台windows,一台Linux.把windows当作服务器 windows10自带ntp服务器,可以按如下步骤进行设置 1. 打开注册表编辑器,在运行里面输 ...

  9. Symmetric Tree(对称二叉树)

    来源:https://leetcode.com/problems/symmetric-tree Given a binary tree, check whether it is a mirror of ...

  10. CentOS7 iptables安装及操作

    添加规则时的考量点: (1)要实现哪种功能:判断添加在哪张表上: (2)报文流经的路径:判断添加在哪个链上: 链上规则的次序: (1)同类规则(访问同一应用),匹配范围小的放上面: (2)不同类规则( ...