`
郑睿9
  • 浏览: 161870 次
  • 性别: Icon_minigender_2
  • 来自: 浙江
社区版块
存档分类
最新评论

jQuery学习笔记之window.onload与$(document).ready()区别

jQueryJavaScriptHTML 
阅读更多

 

执行以下代码，可以发现window.onload与$(document).ready()区别：
1、window.onload必须等待网页中所有内容加载完毕后（包括图片）才能执行；

   $(document).ready()网页中所有DOM结构绘制完毕后就执行，可能DOM元素关联的东西并没有加载完
2、window.onload只能编写一个，示例，只会弹出("test2")；
  $(document).ready()可以编写多个
3、$(document).ready(function(){//..});可以简写成$(function(){//..};)

 

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>FirstjQuery</title>
</head>
<body>
<script type="text/javascript" src="scripts/jquery-1.4.js"></script>
<script type="text/javascript">
$(document).ready(function(){//等待DOM元素加载完毕
	alert("Hello World!");//弹出一个框
	
});
$(document).ready(function(){
	alert("Nice to meet you !");
});

$(function(){
	alert("This is the first jquery tset!");
});
window.onload = function(){
	alert("test1");
};
window.onload =function(){
	alert("test2");
};
</script>
</body>
</html>

 

分享到：
| jQuery学习笔记之jQuery对象与DOM对象相互 ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    脱离document.onload和window.onload的onload事件

    脱离document.onload和window.onload的onload事件，可多次添加加载事件！

    jquery的$(document).ready()和onload的加载顺序

    网上普遍的说法是$(document).ready()是在页面DOM解析完成后执行，而onload事件是在所有资源都准备完成之后才执行，也就是说$(document).ready()是要在onload之前执行的，尤其当页面图片较大较多的时候，这个时间差...

    a1392558812#myShare#28.query_区别onload与ready1

    window.onload与$(function(){})区别包括页面所有的图片加载完成才会回调(晚)只能有一个监听回调页面加载完成就回调(早)可以有多个监听。

    window.onload

    window.onload insertAfter()

    一张表格告诉你windows.onload()与$(document).ready()的区别

    在jquery中，则使用$(document).ready()方法。下面介绍一下两者的区别。   [removed]() $(document).ready() 执行时机 在页面所有元素（包括图片，引用文件）加载完后执行。 页面中所有HTML DOM，CSS DOM结构...

    onload和jquery运行顺序

    window.onload = function () { console.log('window.onload 方式执行') } $(document).ready(function () { console.log('$(document).ready(function(){}) 方式执行') })

    全面解析jQuery $(document).ready()和JavaScript onload事件

    主要介绍了全面解析jQuery $(document).ready()和JavaScript onload事件的相关资料,非常不错具有参考借鉴价值，需要的朋友可以参考下

    初始jQuery

    3. $(document).ready()与window.onload使用场合类似，当有差异 4. jQuery代码中常见的元素包括工厂函数、选择器和方法 5. jQuery程序代码的特殊：包含$符号和连缀操作 6. 每个页面都有对应的DOM模型，DOM模型包括...

    jquery 笔记(自己学习jquery整理好的)

    window.onload=function(){ var otable = document.getElementById('oTable'); for(var i=0 ; i&lt;otable.rows.length ; i++){ if(i%2==0) otable.rows[i].className = 'alrow'; } } $(function(){ $(table....

    JQuery-- onload，ready方法详细解说

    (JQuery-- onload，ready方法详细解说

    js 某个页面监听事件渲染完毕的时间.pdf

    常见的方法有使用window.onload和jQuery的(document).ready两种。其中，window.onload方法是页面所有资源加载完成之后触发，因此性能较差；(document).ready方法是在页面dom元素加载完成之后触发，性能较好。 总体...

    JQuery下关于$.Ready()的分析

    $(document).Ready()方法 VS OnLoad事件 VS $(window).load()方法 接触JQuery一般最先学到的是何时启动事件。在曾经很长一段时间里,在页面载入后引发的事件都被加载在”Body”的Onload事件里. 对于Body的Onload事件...

    jQuery实例教程

    （也许window.onload()能实现同样的功能，但是jQuery更加快速，灵活）。 $(document).ready(fn):当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。这是事件模块中最重要的一个函数，因为它可以极大地提高web...

    获取页面长宽和滚动条的位置

    &lt;!...&lt;html xmlns="http://www.w3.org/1999/xhtml" &gt; function GetPageSize() { var scrW, scrH; if(window.innerHeight && window.scrollMaxY) ... scrW = window.innerWidth ...&lt;body onload="main();"&gt; &lt;/html&gt;

    15天漫游jQuery中文翻译word版

    资源名称：15天漫游jQuery中文翻译 word版内容简介：15天漫游jQuery中译本,不是很完整,但是也是学习jquery 不可或缺的东东1 day Window.onload() 一直是常用的javaｓｃｒｉｐｔ函数。数年来程序员们习惯了通过它在...

    jQuery学习笔记之jQuery中的$

    在jQuery中，最常用的莫过于使用美元符号$，它提供了各种各样的丰富功能。包括选择页面中一个或者一类元素、作为功能函数的前缀、windows.onload的完善，创建DOM节点等。本文介绍jQuery的用法。作为基础 1.选择器 在...

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

    [removed] = function(){ ... 相似，不同的是onload()的方法是在页面加载完成后才发生，这包括DOM元素和其他页面元素（例如图片）的加载，因此，使用document.ready()方法的执行速度比onload()的方法要快。 Javasc

Magicbox
Global site tag (gtag.js) - Google Analytics