学习jQuery的第一件事是：如果你想要一个事件运行在你的页面上，你必须在$(document).ready()里调用这个事件
学习jQuery的第一件事是：如果你想要一个事件运行在你的页面上，你必须在$(document).ready()里调用这个事件。所有包括在$(document).ready()里面的元素或事件都将会在DOM完成加载之后立即加载，并且在页面内容加载之前。 
If you want an event to work on your page, you should call it inside the $(document).ready() function. Everything inside it will load as soon as theDOM is loaded and before the page contents are loaded. 
$(document).ready(function() { 

// put all your jQuery goodness in here. 

//by www.jbxue.com

}); 
有很多方法可以确保事件在页面上正常工作，$(document).ready()比其它方法要更有优势。首先，你不必在HTML上放置任何“ 行为性的”标记。另外，你可以将JavaScript/jQuery写入一个独立的js文件，这样既容易维护，又保证了js与页面内容的隔离。如果你在浏览网页时更加细心，你就会常常看见这种情况：当你将鼠标悬停在一个连接时，有时状态栏中会在显示“javascript:void()”这样的消息。这就是你把一个事件直接放在<a href>标签里所造成的。 
在一些使用traditional JavaScript的页面，你会在<body>标签中看见“onload”属性。这会导致一个问题：它限定了在body上只能有一个函数事件。是的，因为它又往内容中添加的“行为性的”标签。如果你想解决这个问题，请参考Jeremy Keith的书：DOM Scripting，里面讲述了如何在一个单独的js文件里创建一个 “addLoadEvent” 函数，它允许多个函数可以在body里被加载。但是这种方法需要为本来很简单的问题编写相当数量的代码，另外，这种方法是在加载window时触发这些事件的，这不得不让我再一次想起 $(document).ready()的好处。 
使用 $(document).ready()，你能让你的事件在window加载之前加载或触发。所有你写在这个方法里面的都准备在最早的时刻加载或触发。也就是说，一旦DOM在浏览器中注册后，$(document).ready()里的代码就开始执行。这样用户在第一眼看见页面元素时，特效就可以运行了。

jQuery之$(document).ready()使用介绍的更多相关文章

  1. JS的window.onload与JQuery的$(document).ready(function(){})的区别

    前段时间去面试被问及JS的加载(onload)与jQuery中加载(ready)方法的区别,瞬时懵逼了,关于这个知识点平时还真没怎么注意. 最近先来无事便查了一下资料, onload 事件(W3c上给 ...

  2. jQuery的document ready与 onload事件——你真的思考过吗？

    在进行实验和资料查询时,我遇到了几个关键问题: 1. window.onload到底是什么加载完触发? 2. body为什么会有onload事件? 3. 为什么是window.onload,而不是do ...

  3. jQuery中$(function(){})与(function($){})(jQuery)、$(document).ready(function(){})等的区别详细讲解

    1.(function($) {…})(jQuery); 1).原理: 这实际上是匿名函数,如下: function(arg){…} 这就定义了一个匿名函数,参数为arg 而调用函数时,是在函数后面写 ...

  4. javascript的window.onload()方法和jQuery的$(document).ready()的对比

    jQuery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法,不过与window.onload方法还是有区别的. 1.执行时间 windo ...

  5. Jquery中$(document).ready()与传统JavaScript中的window.onload方法的区别(2016/8/3)

    Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法,不过与window.onload方法还是有区别的. 1.执行时间       ...

  6. jQuery中$(function(){})与(function($){})(jQuery)、$(document).ready(function(){})等的区别详细讲解 ----转载

    1.(function($) {-})(jQuery); 1).原理: 这实际上是匿名函数,如下: function(arg){-} 这就定义了一个匿名函数,参数为arg 而调用函数时,是在函数后面写 ...

  7. jQuery中$(function(){})与(function($){})(jQuery)、$(document).ready(function(){})等的区别详解

    1.(function($) {…})(jQuery); 1).原理: 这实际上是匿名函数,如下: function(arg){…} 这就定义了一个匿名函数,参数为arg 而调用函数时,是在函数后面写 ...

  8. Jquery中"$(document).ready(function(){ })"函数的使用详解

    Jquery是优秀的Javascrīpt框架,$是jquery库的申明,它很不稳定(我就常遇上),换一种稳定的写法jQuery.noConflict(); jQuery(document).ready ...

  9. 【jquery】$(document).ready() 与window.onload的区别

    Jquery中$(document).ready()的作用类似于传统JavaScript中的window.onload方法,不过与window.onload方法还是有区别的. 1)执行时间  wind ...

随机推荐

  1. 1.4.2 solr字段类型--(1.4.2.3)使用货币和汇率

    1.4.2 solr字段类型 (1.4.2.1) 字段类型定义和字段类型属性. (1.4.2.2) solr附带的字段类型 (1.4.2.3) 使用货币和汇率 (1.4.2.4) 使用Dates(日期 ...

  2. IOS 设置定时器

    IOS 设置定时器  自动滚动视图 定时发送坐标信息 即时显示 时钟 NSTimer *timer; - (void)start {//1second 调用一次 timer = [NSTimer sc ...

  3. How to setup ELM327 Bluetooth WiFi for Android software Torque

    1.    Install OBDII 2.    Install Android Software Torque a)    Copy software to phone from CD b)   ...

  4. foundation框架之反射机制

    概念 例子 一.概念 反射:根据字符串实例话对象或者调用方法 // // main.m // 反射机制 // // Created by apple on 14-3-28. // Copyright ...

  5. Frameset使用教程 小结

    frame,是网页开发必须掌握的知识.例如后台架构.局部刷新,页面分割,都是frame的用途表现,尤其是后台页面制作,使用frame会给用户带来非常舒适的使用感受. frame知识点包括(frames ...

  6. [freemarker篇]04.简单介绍-基本数据类型

    好几天没有更新博客了,最近一顿乱七八糟的忙!今天简单更新第四章,这里只能说是简单介绍,因为权威的还是需要看Freemarker的官方中文手册! 好几天没有更新博客了,最近一顿乱七八糟的忙!今天简单更新 ...

  7. entOS查看系统信息-CentOS查看命令

    一:查看cpu more /proc/cpuinfo | grep "model name" grep "model name" /proc/cpuinfo 如 ...

  8. 【CSS3】---颜色RGBA及渐变色

    颜色之RGBA RGB是一种色彩标准,是由红(R).绿(G).蓝(B)的变化以及相互叠加来得到各式各样的颜色.RGBA是在RGB的基础上增加了控制alpha透明度的参数. 语法: color:rgba ...

  9. MVC中Jqgrid的用法

    Jqgrid可以接受的数据源格式通常是local.json.string等,而我们通过MVC Controller查询数据库(Linq)通常转化为tolist(),例如: public object ...

  10. 转：C# 获取磁盘及CPU的序列号

    原文地址:http://www.cnblogs.com/stray521/archive/2010/08/06/1793647.html //获取磁盘序列号 try { System.Manageme ...