首先$(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. SourceTree跳过初始设置

    转载https://www.cnblogs.com/xiofee/p/sourcetree_pass_initialization_setup.html 如何跳过初始设置,只需要在安装路径中添加一个a ...

  2. React-Native 之 GD (六)无数据情况处理

    1.还是网络问题,在网络出现问题或者无法加载数据的时候,一般我们会展示空白页,在空白页中提示 无数据 之类的提示,比较好的还会使用 指示器 的方式告诉用户网络出现问题等等. 这边我们做以下处理,当无数 ...

  3. 从 spring-cloud-alibaba-nacos-config 进入 nacos-client

    sc 的 bootstrap context 是 main application context 的 parent,需要在 main application context 中使用的 bean 可以 ...

  4. 阶段1 语言基础+高级_1-3-Java语言高级_06-File类与IO流_04 IO字节流_6_字节输出流写多个字节的方法

    一次写多个字节的方法 要在txt内显示100.49代表1 48 代表0 一次写多个字节 负数前两个组成一个中文.-65和-66 字节数组的一部分 写入字符串方法 当前用的编码格式是utf-8,utf- ...

  5. k8s创建资源

        一.创建方式分类: 命令 vs 配置文件 Kubernetes 支持两种方式创建资源:   1.用 kubectl 命令直接创建(适用于少数的pod创建) kubectl run httpd- ...

  6. Linux(Ubuntu)常用命令(三)

    查看时间  cal :显示当前日期.  cal :显示全年日历./ cal -y 显示当年日历.  date :显示当前时间. 这几个一般不会用到了解即可. 查看进程信息  ps :显示当前进程. - ...

  7. Hyperledger:Fabric CA 用户指南 [译]

    Fabric CA 用户指南 Fabric CA 是 Hyperledger Fabric 的官方配套认证设施. 原文链接:http://hyperledger-fabric.readthedocs. ...

  8. 代码执行testng的几种方式

    一.指定test class Test class FirstTest package cas.eric; import org.testng.annotations.Optional; import ...

  9. Linux 与 Unix 到底有啥区别和联系?

    原文:https://opensource.com/article/18/5/differences-between-linux-and-unix 来源:开源中国社区,译者:Tocy, LinuxTe ...

  10. [BZOJ 2199] [USACO11JAN] 大陆议会The Continental Cowngress(2-SAT)

    [BZOJ 2199] [USACO11JAN] 大陆议会The Continental Cowngress(2-SAT) 题面 题面较长,略 分析 考虑把问题转化成一个依赖性问题 我们把每只奶牛投出 ...