window.onload = function(){ alert("welcome"); } 这样的写法作用是希望在页面加载完,自动执行定义js代码(function)。

$(document).ready(function(){.... })这个函数是用来取代页面中的window.onload;

document.ready()和传统的方法<body onload=”load()”> 相似,不同的是onload()的方法是在页面加载完成后才发生,这包括DOM元素和其他页面元素(例如图片)的加载,因此,使用document.ready()方法的执行速度比onload()的方法要快。

Javascript 只有在DOM元素已经定义以后才可以对其执行某种操作,jQuery使用document.ready来保证所要执行的代码是在DOM元素被加载完成的情况下执行。

比如:

<script type="text/javascript">
$(document).ready(function () {
alert("我的第一个jQuery代码!");
});
</script>

这段代码的意思是:当Dom Tree加载完成后,显示警告信息。document.ready()和传统的方法<body onload=”load()”> 相似,不同的是onload()的方法是在页面加载完成后才发生,这包括DOM元素和其他页面元素(例如图片)的加载,因此,使用document.ready()方法的执行速度比onload()的方法要快。

最后要注意两点):

  1. 确保在 <body> 元素的onload事件中没有注册函数,否则可能不会触发$(document).ready()事件。(

    我尝试用下面的例子来演示这个情况,但是没有成功,所以我想这种情况只是可能发生。)

    <html>
    
    <head>
    
    <title>My second jQuery</title>
    
    <script type="text/javascript" src="/js/jquery.js"></script>
    
    <script type="text/javascript">
    
    //下面是load的函数含有jquery注册函数$
    
    function load(){
    
       $("p").append("<b>Hello</b>");
    
    }
    
    //下面是jQuery的代码
    
    $(document).ready(function () {
    
    $("p").append("我的第一个jQuery代码!");
    
    $("p").append("<b>Hello</b>");
    
    });
    
    </script>
    
    </head>
    
    <body onload="load()">
    
    <h2>jQuery 简单例子2</h2>
    
    <p>I would like to say: </p>
    
    </body>
    
    </html>
  2. 可以在同一个页面中无限次地使用$(document).ready()事件。其中注册的函数会按照(代码中的)先后顺序依次执行。

jquery中的$(document).ready()的更多相关文章

  1. jquery中的$(document).ready()使用小结

    本篇文章主要是对jquery中的$(document).ready()使用方法进行了详细的总结介绍,需要的朋友可以过来参考下,希望对大家有所帮助 window.onload = function(){ ...

  2. jquery中的$(document).ready()、JavaScript中的window.onload()以及body中的onload()的区别

      body中的onload()和window.onload以及$(document).ready()的区别: 1.前两者都表示当页面加载元素(包括图片等信息)完毕后执行的操作,而且两者在各种浏览器中 ...

  3. jquery中的$(document).ready()、JavaScript中的window.onload()以及body中的onload()、DomContentLoaded()区别

    $().ready().$(handler).$(document).ready(handler)均不是原生JS中的,都是jQuery中封装的方法.这些事件在当页面的dom节点加载完毕后就执行,无需等 ...

  4. jQUery中的$(document).ready()方法和window.onload()方法的区别

    1.常规的Javascript代码中,通常使用window.onload方法 window.onload = function(){//代码} 2.jquery中,则使用$(document).rea ...

  5. jquery中的$(document).ready(function(){})和$(window).load()比较

    1.执行时间 window.onload()即jquery写法中的$(window).load(function(){})必须等到页面内包括图片的所有元素加载完毕后才能执行. $(document). ...

  6. body中的onload()函数和jQuery中的document.ready()有什么区别?

    1.我们可以在页面中使用多个document.ready(),但只能使用一次onload(). 2.document.ready()函数在页面DOM元素加载完以后就会被调用,而onload()函数则要 ...

  7. jquery中的$(document).ready(function() {});

    当文档载入时执行function函数里的代码, 这部分代码主要声明,页面加载后 "监听事件" 的方法.例如: $(document).ready( $("a") ...

  8. jquery mobile在页面加载时添加加载中效果 document.ready 和window.onload执行顺序比较

    想要添加这个效果,先来弄明白页面的加载和事件执行顺序,看这个简单例子: <html xmlns="http://www.w3.org/1999/xhtml"> < ...

  9. JQuery排错关于$(document).ready(function(){});

    最近写了好多JQuery.也出了很多问题.不知道怎么回事.程序就不往下执行了.很是郁闷. 查了下资料,这里可能会有以下几种原因:1.js文件的引用路径不正确,特别是使用了命名空间,容易造成路径错误,使 ...

随机推荐

  1. Random获取不重复随机数

    Random R = new Random(Guid.NewGuid().GetHashCode());            int i = R.Next(9999);

  2. 值得细细品读的URL资源

    Web安全渗透方面的资源指南: 知乎综合问答:https://www.zhihu.com/question/21914899 渗透测试经典演练系统:http://www.freebuf.com/sec ...

  3. NASA的CTO——开源软件使我们诚实

    Chris C.Kemp,谷歌设置新职位CTO让他领导 原文: NASA's CTO: Open source software keeps us honest 作者: Shawn Freeman 译 ...

  4. 写一个c程序辨别系统是16位or32位

    方法: 32位处理器就是一次只能处理32位,也就是4个字节的数据,虚拟地址空间的最大大小是4G,而64位处理一次就能处理64位,即8个字节的数据,最大虚拟地址空间的最大大小是16T.最明显的是指针大小 ...

  5. 关于SCANF 与 GETS(C语言)

    SCANF遇到空格会自动停止录入字符串,而GETS不会,GETS可以用于输入带空格的字符串

  6. 树莓派 Learning 002 装机后的必要操作 --- 07 设置静态IP地址

    树莓派 装机后的必要操作 之 设置静态IP地址 我的树莓派型号:Raspberry Pi 2 Model B V1.1 装机系统:NOOBS v1.9.2 为了避免IP变来变去,我们将IP地址设置为静 ...

  7. PureUI(扩展版本)

    喜欢一个UI(pure,官网)不怎么更新(可能官方认为不需要更新).我自己做了扩展和修正,整个库下载地址:http://files.cnblogs.com/files/RainbowInTheSky/ ...

  8. JS实现自动轮播图效果(js案例)

    现在很多网站都有轮播图,这篇文章主要为大家详细介绍了js实现轮播图的完整代码及原理,需要的小伙伴可以参考一下. 1.轮播图主要功能: 1.  图片自动轮播(主图切换同时下面导航图片也会跟着变化) 2. ...

  9. 多实例:MySQL系列之二

    MySQL的多实例配置 ​ 在一台物理机中需要多个测试环境,那么就需要用到了搭建数据库的多个实例,多个实例的意思就是运行多份程序,实例与实例之间没有影响.要注意监听的端口需要不同. 环境:CentOS ...

  10. POJ1442 Black Box 堆

    用大根堆和小根堆分别存放前$i-1$大的元素前$k-i$小的元素. 将当前序列的元素压入最小堆,如果最小堆的最小数大于最大堆的最大数则进行交换,保证最大堆中的所有数小于最小堆. 因为$i$值每进行一次 ...