JavaScript高级 面向对象（10）--onload与jq中ready的区别
说明（2017.4.2）：
1. 在body中放一个img标签，src链接一张图片，那么页面会先读取html的document文档，然后再读取外部资源（这里没加onload其实就是从上往下顺序读取）。
外部资源包括导入的js，css，图片，音乐，视频等等。
onload会将所有的资源包括外部资源全部加载完成。
而jquery的ready只要加载完dom树就完成了，里面的图片等资源有没有加载无所谓。
<body>
<img src="1.jpg">
</body>
2. 如果img里面的src为空，就只读取了document。
3. 做一个测试，输出图片的宽高。
直接输出image的高宽，结果显示是0,0，当用image.onload的时候，显示了真实高宽，因为onload是等所有资源都加载完毕了。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
<script type="text/javascript">
// var image = document.createElement("img");
// 另一种创建图片的方法
var image = new Image();
image.src = "1.jpg";
document.body.appendChild(image);
// console.log(image.width + ", " + image.height);
image.onload = function(){
console.log(image.width + ", " + image.height);
};
</script>
</html>
JavaScript高级 面向对象（10）--onload与jq中ready的区别的更多相关文章
- JavaScript高级 面向对象（5）--内存逻辑图画法
说明(2017.3.30): 1. 使用软件diagram designer,DiagramDesignerSetup1.28.zip,很小只有1M多,我用的自带画图软件.教学视频是“JavaScri ...
- 【Python全栈-JavaScript】JavaScript的window.onload()与jQuery 的ready()的区别
JavaScript的window.onload()与jQuery 的ready()的区别 做web开发时常用Jquery中$(document).ready()和JavaScript中的window ...
- JavaScript高级 面向对象的程序设计 （一）《JavaScript高级程序设计（第三版）》
创建对象 继承 面向对象的语言都有一个表示---类.通过类我们可以创建多个具有相同属性的对象.但是,在JS中并没有类的概念,所以JS的对象也和其他语言的对象不同. 对象的定义:无序的属性集合,其属性可 ...
- JavaScript高级 面向对象的程序设计 （二）《JavaScript高级程序设计（第三版）》
二.继承 OO是面向对象语言最为有魅力的概念.一般的OO语言都实现了两种继承,接口继承和实现继承.接口继承只继承方法签名,而实际继承继承了实际的方法. 而在JS中,函数没有签名,所以无法实现接口继承. ...
- JavaScript高级程序设计(二)：在HTML中使用JavaScript
一.使用<script>元素 1.<script>元素定义了6个属性: async:可选.表示应该立即下载脚本,但不应该妨碍页面中的其他操作,比如下载其他资源或等待加载其他脚本 ...
- JavaScript高级程序设计-10.11: DOM及其扩展
什么是DOM? DOM(文档对象模型)是针对 HTML 和 XML 文档的一个 API(应用程序编程接口).DOM描绘了一个层次化的节点树,允许开发人员添加.移除和修改页面的某一部分. 文档节点(do ...
- 《JavaScript高级程序设计》读书笔记--ECMAScript中所有函数的参数都是按值传递的
ECMAScript中所有函数的参数都是按值传递的.也就是说把函数外部的值复制给函数内部的参数(内部参数的值的修改不影响实参的值). 基本类型变量的复制: 基本类型变量的复制,仅仅是值复制,num1和 ...
- JavaScript高级 面向对象（13）--构造函数的执行过程
说明(2017-4-2 21:50:45) 一.构造函数是干什么用的: 1. 初始化数据的. 2. 在js给对象添加属性用的,初始化属性值用. 二.创建对象的过程: 1. 代码:var p = new ...
- JavaScript高级 面向对象（12）--引用类型值类型作为参数传递的特性
说明(2017-4-2 18:27:11): 1. 作为函数的参数,就是将函数的数据拷贝一份,传递给函数的定义中的参数. 函数foo()在调用的时候,做了两件事: (1)函数在调用的时候,首先需要将参 ...
随机推荐
- 使用spring的@Async异步执行方法
应用场景: 1.某些耗时较长的而用户不需要等待该方法的处理结果 2.某些耗时较长的方法,后面的程序不需要用到这个方法的处理结果时 在spring的配置文件中加入对异步执行的支持 <beans x ...
- 17、JAVA流程控制
一.IF 1.第一种形式:if if(逻辑表达式){ 语句1; 语句2; ... } 当if中只有一条语句时,可以省略{} 2.第二种形式:if-else if(逻辑表达式){ 语句块1: } els ...
- 用C/C++开发android应用
在某些情况下,比如原来与很多c/c++的代码, 可能希望采用c/c++编写android应用程序.在这种情况下,一般使用NDK.但是由于android直提供了java接口,因此不能够直接调用andro ...
- 如何使php页面中不再出现NOTICE和DEPRECATED的错误提示
在php.ini配置文件中修改: error_reporting=E_ALL & ~E_NOTICE & ~E_DEPRECATED 亲测有效,拿去用吧
- 中国城市线划分—Where do you want to develop......
- mybatis报错 Specified class is an interface
本文转自:http://blog.csdn.net/u014331288/article/details/53869303 1.错误原因 Caused by: org.springframework. ...
- 学习Tkinter
tutorial point这个网站教程很多,无所不包.还包括一堆在线IDE,值得收藏 一.第一个tkinter程序 import tkinter top = tkinter.Tk() # Code ...
- sigmoid 函数与 softmax 函数
sigmoid 函数与 softmax 函数 1. sigmoid 函数 sigmoid 函数又称:logistic函数,逻辑斯谛函数.其几何形状即为一条sigmoid曲线. lo ...
- 苹果越狱后必备软件，总有你需要的！11月23日追加14个，支持【iOS4】
http://bbs.dospy.com/thread-7398730-1-301-2.html越狱后必备软件,总有你需要的!11月23日追加14个,支持[iOS4] 背景自定义插件
- 重写lucene.net的分词器支持3.0.3.0版本
lucene.net中每个分词器都是一个类,同时有一个辅助类,这个辅助类完成分词的大部分逻辑.分词类以Analyzer结尾,辅助类通常以Tokenizer结尾.分类词全部继承自Analyzer类,辅助 ...