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. javascript数字千分分隔符

    function thousandBitSeparator(num) { num=num.toFixed(2); return num && num .toString() .repl ...

  2. MySQL绿色版的安装步骤

    由于工作需要最近要开始研究MySQL了(看来学习都是逼出来的),本人对mysql没有研究,可以说一个小白. 下面就从安装开始吧,虽然网上关于这方面的东西很多,还是需要自己把操作过程写下来. 1.数据库 ...

  3. Java探索之旅(3)——选择与循环

    1.选择结构与输出 ❶Switch语句: Switch表达式必须算出 char,byte,short,int类型数值之一,总是括号括住:Value1----ValueN,对应有相同数据类型且为常量或者 ...

  4. EchoServer和EchoClient模型的改进1之多线程

    在之前的EchoServer模型个EchoClient模型中,客户端和服务端只是单纯的一一对应的关系,如果存在多个客户端和一个服务端,这就需要具体处理了.在这里我们明显想到的第一种方案是使用多线程处理 ...

  5. docker里安装ubuntu

    使用 Ubuntu 官方镜像 Ubuntu 相关的镜像有很多,这里使用 -s 10 参数,只搜索那些被收藏 10 次以上的镜像 $ docker search -s 10 ubuntu NAME DE ...

  6. 解决PCL MLS : error LNK2019; error LNK2001 virtual MovingLeastSquares process performProcessing问题

    PCL 基于多项式拟合的法线估计.点云平滑和数据重采样 在使用Window VS2010为开发平台,学习PCL点云库的时候,学到曲面重建(Surface).在测试下面的程序的时候,遇到了问题. #in ...

  7. 6.7 安装ant

    准备好安装包: 安装vim: 解压: tar -xzvf apahce-ant-1.10.1-bin.tar.gz 这里,我将apache-ant-1.10.1-bin.tar.gz复制并解压到了/h ...

  8. jquery提供的数据提交方式1

    1,ajax提交,部分代码为easyui function editNode(id){ $.ajax({ dataType:'json', async:true, //默认的就是异步提交 type:' ...

  9. 日记(18)-20141008---PHP是做什么的

    1,PHP 是一种用来制作动态网页的服务器端脚本语言.2,因为PHP脚本是写在 HTML 文档中的,你不必用特殊的编辑器来创建页面.3,php 是一种服务器端的脚本语言,一般用来做网站. (感言,我太 ...

  10. js中将字符串转为JSON的三种方式

    1.eval方式解析,恐怕这是最早的解析方式了.如下: function strToJson(str){ var json = eval('(' + str + ')'); return json; ...