window.onload和$(document).ready()比较
浏览器在页面加载完毕后,JS通常使用window.onload方法为DOM元素添加事件,而jQuery使用的是$(document).ready()方法。两者功能相似,但也有细微差异,下面简要对比一下两者之间的区别。
| window.load | $(document).ready() | |
| 执行时机 | 必须等待网页中所有内容加载完毕后才能执行(包括图片等) | 只要网页中的DOM结构绘制完毕就执行(与DOM相关的文件此时可能还未下载完毕) |
| 使用情况 |
1.不能同时执行多个,若编写多个函数只执行最后一个(前面的被覆盖)。 window.onload = function() test1{ alert("function1");}; window.onload = function() test2{ alert("function2");} 最终输出结果为"function2"。 2.如果想实现多个函数的调用,可以创建一个新的函数来包含它们。 window.onload = function(){ test1(); test2(); } |
1.能够同时编写多个函数,按注册顺序执行。 $(document).ready(function(){ test1(); }); $(document).ready(function(){ test2(); }) 两次都输出。 2.如果想实现window.onload一样的功能,调用load()方法。 $(window).load(function(){ //代码 }) |
| 简化 | 无 |
以下两种形式与$(document).ready()等价,但更简洁。 1.$().ready(function(){ //代码 }); 2.$(function(){ //代码 }); |
全文完,欢迎各位前辈批评指正。
window.onload和$(document).ready()比较的更多相关文章
- window.onload和$(document).ready(function(){})的区别
前段时间在面试之前查找并整理了一下window.onload和$(document).ready(function(){})区别,今天有时间更到我的博客上,由于本人资历尚浅,如有不对的地方,还请指正. ...
- window.onload和$(document).ready()的区别
window.onload和$(document).ready()的区别,如下表所示 window.onload $(document).ready() 执行时间 在页面所有内容(图片.文件)加载 ...
- js常见执行方法window.onload = function (){},$(document).ready()
1. window.onload = function(){}; 当页面DOM对象加载完毕,web浏览器能够运行JS时,此方法即被触发. 2. $(document).ready();当web页面以及 ...
- window.onload和document.ready的区别
window.onload和document.ready虽然两个方法的运行效果都一样,但他们之间是存在着区别的: 一.从执行的时间 window.onload在dom文档结构加载完毕以后就可以执行,不 ...
- window.onload与$(document).ready()的区别
对于很多初学者来说,window.onload出现在代码中的频率非常高,这似乎变成了一种习惯,可是并不知道具体为什么要加这句代码,可以做几个试验对比: 实验一: <script> docu ...
- window.onload与$(document).ready()区别
2013-12-08 17:11:34 window.onload一次只能执行一个程序,而$(document).ready()可以按照先后顺序执行多个程序. eg: function one(){ ...
- JS ——window.onload与$(document).ready()
我们常常在页面加载完成以后做一些操作,比如一些元素的显示与隐藏.一些动画效果.我们通常有两种方法来完成这个事情,一个就是window.onload事件,另一个就是JQuery的ready()方法.那么 ...
- 【jQuery】window.onload 和 $(document).ready() 的区别
... 在Stack Overflow上看到了这个问题,自己翻译了过来. The onload event is a standard event in the DOM, while the read ...
- 菜鸟学JS(五)——window.onload与$(document).ready()
我们继续说JS,我们常常在页面加载完成以后做一些操作,比如一些元素的显示与隐藏.一些动画效果.我们通常有两种方法来完成这个事情,一个就是window.onload事件,另一个就是JQuery的read ...
随机推荐
- asp.net+mvc+easyui+sqlite 简单用户系统学习之旅(四)—— session传递登录人信息显示+用户注销
前面的学习,已经做好了简单的登录和主页,涉及了三层软件架构,mvc,easyui的layout.tree.tab.window,sqlite,动软代码自动生成. 下面完善一下登录跳转主页后,在sout ...
- datagridview 日期列排序
1.datagridview 日期列排序 private void Form1_Load(object sender, EventArgs e) { //方法1 dataGridView1.Colum ...
- Mysql 常用函数集
1.分类导航 一共分为5类函数 . 字符型函数 . 数值型函数 . 日期型函数 . 统计型函数 . 其它型函数 2.字符型函数[约48个] ascii(str) bin(n) bit_length(s ...
- php常见的类库-文件操作类
工作中经常用php操作文件,因此把常用文件操作整理出来: class hylaz_file{ /** * Read file * @param string $pathname * @return s ...
- html5_websocket_tomcat8
目录 前言 后端 浏览器前端 java的client 注意 前言 HTML5 WebSocket实现了服务器与浏览器的双向通讯,开销小,实时性高,常用于即时通讯和对信息实时性要求比较高的应用. 下面讲 ...
- start-stop-daemon
start-stop-daemon是OpenRC计划的一部分,这个程序最先出现在Debian系的Linux发行版中,这里有个比较古老的手册页面,更详细更直观的办法当然是通过man start-stop ...
- Vsphere日记02.ESXi5.5.configuration
2.Vsphere ESXi 5.5 configuration 步骤1:启动 ESXI 服务器 步骤2:按 F2 进入用户登录界面 输入用户名及密码,进入参数设置界面.密码为我安装时候设置的&quo ...
- repaint和reflow的相关知识
一个页面由两部分组成: DOM:描述该页面的结构 render渲染:描述 DOM 节点 (nodes) 在页面上如何呈现 repaint重绘: 当 DOM 元素的属性发生变化 (如 color) 时, ...
- marquee标签跑马灯连续无空白播放效果 纯CSS(chrome opera有效)
marquee似乎没有设置首尾相连播放的属性,内容滚动时总会留出一段marquee本身长度的空隙,某些情况下很不方便: 捣鼓了一会,得出一种解决办法,关键有两点: 1.将需要滚动的内容复制一份于同一行 ...
- Servlet 环境设置
开发环境是您可以开发.测试.运行 Servlet 的地方. 就像任何其他的 Java 程序,您需要通过使用 Java 编译器 javac 编译 Servlet,在编译 Servlet 应用程序后,将它 ...