一、两大事件

load事件:指页面包含图片等文件在内的所有元素都加载完毕后执行的事件。

ready事件:表示文档结构已加载完成(不包括图片等非文字媒体文件)

浏览器页面渲染的过程 - 寸寸君 - 博客园

http://www.cnblogs.com/cuncunjun/p/6531495.html 看过我这篇文章的同学应该就明白为何图片这么特殊了,知道什么时候加载图片了。

二、在不同语言中的用法

  • HTML:

    在此处提一句,load与onload的关系就和click和onclick的关系一样。

    <body onload=" aa()">

    一般绑在body标签上,用在其他标签也可以。比如img
  • js:

    window.onload=function(){ };
  • jQuery:
    • $(document).load(function(){ }); //值得注意的是,jQuery1.8版本已经将该方法和unload()删除了。
    • $(document).ready(function(){ });//不推荐
    • $(function(){ });//推荐,此方法和上一个写法是等价的。省略就相当于是ready方法。

看到这里,小伙伴们应该明白jQuery方法为何要在外层加一个$()了吧。当初刚开始尝试写代码的时候,将script标签放在了head中,js文件中也没有加ready方法。结果发现页面根本没反应啊啊啊啊,后来查了一下说是得再最外层加上$()才能执行。现在终于明白了,不是没执行,而是在dom树渲染出来之前就执行完了,都是无效的操作呀!如果,不想加ready方法的话,直接把script放在body的尾部即可!

js/jQuery中load()、onload()、ready()的区别的更多相关文章

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

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

  2. jquery中mouseover和mouseenter的区别

    jquery中mouseover和mouseenter的区别 一.总结 一句话总结: 见名知意:enter(进入)和over(在上方)的意思好好思考一下 mouseover就是从子元素回到自己的时候也 ...

  3. js jquery中 的数据类型

    任何一门语言, buguan 是动态的, 还是像C语言的, 都有严格的 类型 "概念的", 这个是由于 编译器和解释器要求的, 需要的. 所以在是使用像 js, jquey ,ph ...

  4. jQuery中.attr()和.prop()的区别

    之前学习jQuery的时候,学习到了两种取得标签的属性值的方法:一种是elemJobj.attr(),另一种是elemJobj.prop().而在学习JS的时候,只有一种方法elemObj.getAt ...

  5. Jquery中的 height(), innerHeight() outerHeight()区别

    jQuery中的 height innerHeight outerHeight区别 标准浏览器下: height:高度 innerHeight:高度+补白 outerHeight:高度+补白+边框,参 ...

  6. 基于jquery中children()与find()的区别介绍

    本篇文章介绍了,基于jquery中children()与find()的区别,需要的朋友参考下 .children(selector) 方法是返回匹配元素集合中每个元素的所有子元素(仅儿子辈).参数可选 ...

  7. Jquery中.attr()和.data()的区别

    $.attr()和$.data()本质上属于DOM属性和Jquery对象属性的区别. 一个简单的例子 <!DOCTYPE html> <html> <head> & ...

  8. jQuery中first-child与first选择器区别

    1.first-child first-child为每个父级元素匹配第一个子元素,可以匹配出多个元素: 示例代码: <!DOCTYPE html> <html lang=" ...

  9. jQuery中this与$(this)的区别总结

    这里就谈谈this与$(this)的区别. 1.jQuery中this与$(this)的区别 $("#textbox").hover( function() { this.titl ...

随机推荐

  1. PHP生成短信验证码

    简单版本 <?php function generate_code($length = 6) { $min = pow(10 , ($length - 1)); $max = pow(10, $ ...

  2. Java 导出Excel的各种尝试

    最近的一个项目比较忙,一直没时间过来跟新博客.今天过来分享一下在此项目中遇到的一个小问题:导出Excel:相信导出Excel这个功能是特别常见的,也有很多的方式.好了,不多说了,直接说说自己遇到的各种 ...

  3. 基于Xcode8插件开发~一键检测处理头文件引用

    Xcode8开放了新的一个Extension:Xcode Source Editor Extension,目的是让开发者可以正规的自主为IDE编写插件,虽然说系统现提供的功能还比较拮据,但是不妨碍我们 ...

  4. 各个浏览器开启CSS Grid Layout的方式

    2017年3月,Chrome.Firefox将开启默认支持. 当然对于很多人等不及浏览器默认支持,想提前体验一把,这里提供一些打开方式: 1.Chrome 在浏览器中输入:chrome://flags ...

  5. 数据流程redux学习(一)

    思考题: react+redux开发这么一个原型,要怎么开发? 整个redux流程的逻辑非常清晰,数据流是单向循环的,就像一个生产的流水线: store(存放状态) -> Container(显 ...

  6. 【LeetCode题解】二叉树的遍历

    我准备开始一个新系列[LeetCode题解],用来记录刷LeetCode题,顺便复习一下数据结构与算法. 1. 二叉树 二叉树(binary tree)是一种极为普遍的数据结构,树的每一个节点最多只有 ...

  7. 在ubuntu linux 中编写一个自己的python脚本

    在ubuntu linux 中编写一个自己的简单的bash脚本. 实现功能:终端中输入简单的命令(以pmpy为例(play music python),为了区别之前说的bash脚本添加了py后缀),来 ...

  8. Javascript日期格式化指定格式的字符串实现

    代码部分 TypeScript /** * format a Date object * 将 Date 转化为指定格式的String * @param {Date} date 源日期对象 * @par ...

  9. js判断为空Null与字符串为空简写方法

    下面就是有关判断为空的简写方法.   代码如下: if (variable1 !== null || variable1 !== undefined || variable1 !== '') {  v ...

  10. DOM解析,取得XML文件里面的信息

    1 创建解析器工厂 DocumentBuilderFactory factory = DocumentBuilderFactory.newInstance(); 2 解析器工厂对象创建解析器对象 Do ...