一个页面直到document是”ready“才能被安全的操作,Jquery为你检查这种状态。代码包含在$( document ).ready()的内部将会仅仅运行一次在页面Document Object Model (DOM)准备好执行JS代码之后。代码包含在$( window ).load(function() { ... })的内部将会运行一次在整个页面里准备好之后,不仅仅是DOM。
$( document ).ready(function() {
console.log( "ready!" );
});
     有经验的开发人员有时会使用$( document ).ready()的缩写。如果你不是有经验的jquery开发人员,最好还是写完整。
$(function() {
console.log( "ready!" );
});
     你也可以通过一个命名函数去$( document ).ready(),而不是通过匿名函数。
//传递方法名
function readyFn( jQuery ) {}
$( document ).ready( readyFn );
$( window ).load( readyFn );
     下面的例子是$( document ).ready()和$( window ).load(),这代码尝试去加载一个网站在<iframe>里并检查这两个事件。
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
$( document ).ready(function() {
console.log( "document loaded" );
});
$( window ).load(function() {
console.log( "window loaded" );
});
</script>
</head>
<body>
<iframe src="http://techcrunch.com"></iframe>
</body>
</html>
 
 
 
 
 
 
 
 
 
 

JQuery官方学习资料(译):$( document ).ready()的更多相关文章

  1. JQuery官方学习资料(译):避免与其他库的冲突

    避免与其他库的冲突     JQuery库和它所有的插件都是包含在jQuery命名空间下的,作为一般规则,全局对象被存储在jQuery的命名空间内,所以你不会得到jQuery和任何其他库之间的冲突(例 ...

  2. JQuery官方学习资料(译):类型

    类型     JavaScript提供了多个内置数据类型.除了这些,这份文档还将介绍一些虚拟类型,例如选择器.伪类.事件等. String 在JavaScript中字符串是一个不可变的对象,它包含无. ...

  3. JQuery官方学习资料(译):JQuery对象

        每当创建一个新的元素(或者选择一个已经存在的元素)时,JQuery将返回一个元素的集合.大部分的开发人员新接触JQuery的时候,都把这个集合当做数组.这个集合中的DOM元素有从零开始的索引, ...

  4. JQuery官方学习资料(译):使用JQuery的.index()方法

        .index()是一个JQuery对象方法,一般用于搜索JQuery对象上一个给定的元素.该方法有四种不同的函数签名,接下来将讲解这四种函数签名的具体用法. 无参数的.index() < ...

  5. JQuery官方学习资料(译):遍历JQuery对象和非JQuery对象

        JQuery提供了一个对象遍历的Utility方法$.each()和一个JQuery集合遍历方法.each(). $.each()     $.each()是一个通用的方法用来遍历对象和数组, ...

  6. JQuery官方学习资料(译):Utility方法

        JQuery提供了一些utility方法在$命名空间里,这些方法对完成常规的编程任务非常有帮助. $.trim()     删除前后部的空白内容. // 返回 "lots of ex ...

  7. JQuery官方学习资料(译):Data方法

        你可能经常会想需要通过元素来存储一些数据.在JavaScript中你可能需要给元素添加属性来实现这样的功能,但是在某些浏览器中,你可能还需要处理因此造成的内存泄露问题.JQuery提供了一个简 ...

  8. JQuery官方学习资料(译):CSS

        JQuery提供了一个处理方法,可以获取或设置元素的CSS属性. // 获取 CSS 属性 $( "h1" ).css( "fontSize" ); / ...

  9. JQuery官方学习资料(译):遍历

        一旦你通过JQuery创建了选择器,你就可以对此进行更为深入的遍历.遍历可以分为三个基本组成部分,父节点.子节点和兄弟节点.JQuery为这些部分提供了许多丰富易用的方法. <div c ...

随机推荐

  1. CentOS6.2上安装pip

    如果yum install pip执行失败.按如下步骤执行 首先安装epel扩展源: yum -y install epel-release 然后执行yum --disablerepo=epel -y ...

  2. 使用通配符和泛型:完成父子类关系的List对象的类型匹配

    泛型和通配符 使用泛型和通配符都可以让一个方法所表示的算法逻辑适应多种类型. Java中具备继承关系的类A.B(A extends B)它们的集合List<A>和List<B> ...

  3. MapReduce多种join实现实例分析(一)

    一.概述    对于RDBMS中的join操作大伙一定非常熟悉,写sql的时候要十分注意细节,稍有差池就会耗时巨久造成很大的性能瓶颈,而在Hadoop中使用MapReduce框架进行join的操作时同 ...

  4. 技术干货:实时视频直播首屏耗时400ms内的优化实践

    本文由“逆流的鱼yuiop”原创分享于“何俊林”公众号,感谢作者的无私分享. 1.引言 直播行业的竞争越来越激烈,进过2018年这波洗牌后,已经度过了蛮荒暴力期,剩下的都是在不断追求体验.最近正好在做 ...

  5. FragmentTabHost用法

    FragmentTabHost组成 Tabhost,TabWidget,切换的内容容器FrameLayout 层级关系 ----FragmentTabHost |-----TabWidget |--- ...

  6. OutOfMemoryError 到底能不能被捕获?

    感觉中,OutOfMemeryError(内存溢出错误) 是jvm抛出的异常,是不能被捕获的. 直到工作中真的遇到OOM异常,而且tomcat服务还一直对外提供服务. 那么问题来了: 1. OOM 到 ...

  7. JavaScript 对象(上)

    简述: 1.是 JavaScript 的基本类型 2.是一种复合值,可通过名字访问这些值 3.可看作属性的无序集合,每个属性都是一个名/值对(属性名是字符串或标识符) 4.可以从一个称为原型的对象继承 ...

  8. while true 死循环判断端口按顺序启动应用

    需求:spring微服务应用启动较慢并且要求一个应用启完才能启第二个应用. 思路:加了个while true 死循环判断端口启动了才启下一个应用. 执行方式:/appupgrade/spring_cl ...

  9. Linux编程 22 shell编程(输出和输入重定向,管道,数学运算命令,退出脚本状态码)

    1. 输出重定向 最基本的重定向是将命令的输出发送到一个文件中.在bash shell中用大于号(>) ,格式如下:command > inputfile.例如:将date命令的输出内容, ...

  10. mysql 开发基础系列21 事务控制和锁定语句(下)

    1.  隐含的执行unlock tables 如果在锁表期间,用start transaction命令来开始一个新事务,会造成一个隐含的unlock tables 被执行,如下所示: 会话1 会话2 ...