$.ready和onload 区别
1、jq ready()的方法就是Dom Ready
他的作用或者意义就是:在DOM加载完成后就可以可以对DOM进行操作。
一般情况先一个页面响应加载的顺序是,域名解析-加载html-加载js和css-加载图片等其他信息。
那么Dom Ready应该在“加载js和css”和“加载图片等其他信息”之间,就可以操作Dom了。
2、Dom Load
用原生的js的时候我们通常用onload时间来做一些事情,比如:
window.onload=function(){
//do something
}
//或者经常用到的图片,假设这个
document.getElementByIdx_x("imgID").onload=function(){
//do something
}
这种就是Dom Load,他的作用或者意义就是:在document文档加载完成后就可以可以对DOM进行操作,document文档包括了加载图片等其他信息。
那么Dom Load就是在页面响应加载的顺序中的“加载图片等其他信息”之后,就可以操作Dom了。
3.用个最常用的例子说明Dom Ready和Dom Load两者的区别
Dom Ready是在dom加载完成后就可以直接对dom进行操作,比如一张图片只要<img>标签完成,不用等这个图片加载完成,就可以设置图片的宽高的属性或样式等;
Dom Load是在整个document文档(包括了加载图片等其他信息)加载完成后就可以直接对dom进行操作,比如一张图片要等这个图标加载完成之后才能设置图片的宽高的属性或样式等;
比如一个图片浏览的效果,通常如果图片尺寸很大的情况下,为了防止图片把页面撑开通常会限定图片的宽度或高度,如果是单张图片或者是多张规格比例统一的图片下我们可以直接在<img>上价格宽度或者高度的属性<img src=“img.jpg” alt=”码头的大照片” width=“100” height=“90”>,比如(推荐)或者可以在css样式中加宽度或者高度的属性。但是如果这些张规格比例不统一的图片要浏览呢?那就有问题,你设置宽高很可能造成图片严重失真。在ie6之后ie7,ie8还有其他主流浏览器支持css2.1中min-width,max-width,min-height,max-width,这样我们就可以用min-width,max-width,min-height,max-width解决这些问题,但是ie6除非是抛弃性能问题用css表达式
随机推荐
- 解决windows10下无法安装.net framework 3.5,错误代码0x800F081F
1.下载 NET Framework 3.5的安装包netfx3.cab: http://download.windowsupdate.com/d/msdownload/update/software ...
- ms17-010漏洞利用教程
ms17-010 漏洞利用并拿下服务器教程 攻击环境: 攻击机win2003 ip:192.168.150.129 Window2003 Python环境及工具 攻击机kali: ip:192.168 ...
- React & TypeScript
之前看了一下 TypeScript 的知识,但是一直没有上手,最近开始结合 React 和 TypeScript 一起尝试了一下,感受还是很好的,所以写一下笔记. 环境配置没有参考其他东西,就是看了下 ...
- iOS 开源库系列 Aspects核心源码分析---面向切面编程之疯狂的 Aspects
Aspects的源码学习,我学到的有几下几点 Objective-C Runtime 理解OC的消息分发机制 KVO中的指针交换技术 Block 在内存中的数据结构 const 的修饰区别 block ...
- [BJWC2011]最小三角形
嘟嘟嘟 这一看就是平面分治的题,所以就想办法往这上面去靠. 关键就是到\(mid\)点的限制距离是什么.就是对于当前区间,所有小于这个距离的点都选出来,参与更新最优解. 假设从左右区间中得到的最优解是 ...
- 在centos7上搭建博客之小白教程~
原理 http使用方法一编译安装,php模块打入方式实现. 软件版本 在本次实验中,我们需要用到的软件版本如下: apr-1.6.2 apr-util-1.6.0 httpd-2.4.28 maria ...
- R执行报错:Error in `[<-.ts`(`*tmp*`,...only replacement of elements is allowed
原因: pred$mean是Time-Series类型,rbind函数不支持.通过as.double将其转换成double类型即可. 修改前代码: all_predata_time <- dat ...
- python操作数据库(Mysql)
原文地址:https://www.cnblogs.com/R-bear/p/7022231.html python DB-API介绍 1.python标准数据库接口为 python DB-API,py ...
- 传入一个integer数组,取出最大、最小值
/** * <p> * 传入一个integer数组,取出最大值 * </p> * @author yunns 2015年11月19日 * @param array * @ret ...
- ASP.NET Core下载大文件的实现
当我们的ASP.NET Core网站需要支持下载大文件时,如果不做控制可能会导致用户在访问下载页面时发生无响应,使得浏览器崩溃.可以参考如下代码来避免这个问题. 关于此代码的几点说明: 将数据分成较小 ...