$(document).ready()
$(document).ready(function(){XX})
window.onload = function(){ if(document.readyState == "complete"){XX}}
http://www.cnblogs.com/lhb25/archive/2009/07/30/1535420.html
一、两者比较
1.执行时间
window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。
$(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕。
2.编写个数不同
window.onload不能同时编写多个,如果有多个window.onload方法,只会执行一个
$(document).ready()可以同时编写多个,并且都可以得到执行
3.简化写法
window.onload没有简化写法
$(document).ready(function(){})可以简写成$(function(){});
二、解释
jQuery有一个用来作为DOM快速载入javascript的得心应手的小函数,那就是ready… 他在页面加载完成之前执行。 (也许window.onload()能实现同样的功能,但当window.onload函数执行的时候,要说明所有东西已经载入,包括图像和横幅等等。要知道较大的图片下载速度会比较慢,因此用户必须等待大图片下载完毕才能看到window.onload()执行的代码效果,这样就花费了很长的等待时间,这不是我们想要的。)。
$(document).ready(fn):当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。这是事件模块中最重要的一个函数,因为它可以极大地提高web应用程序的响应速度。 简单地说,这个方法纯粹是对向window.load事件注册事件的替代方法。通过使用这个方法,可以在DOM载入就绪能够读取并操纵时立即调用你所绑定的函数.
$(document).ready(function(){
// 你的代码
});
$(document)意思是说,获取整个网页文档对象(类似的于window.document),$(document).ready意思就是说,获取文档对象就绪的时候。
上面这段代码的意思是检查文档对象直到它能够允许被操作(译者注:这样做比window.onload()函数要快的多,因为只要文档对象载入完成就能够执行代码了,而不需要等待页面中的图片下载是否已经完成)---这是我们想要的。
三、bind函数的参数传递问题
bind函数的定义: $(selector).bind(event,[data,]function)
function句柄中调用的this参数 不是绑定的元素,而是bind绑定的事件
想再函数句柄中传递参数 可以采用下面的方法, 个人偏向第二种方法,代码易读、简单
1. 默认方法 event.data
想传递参数给function 可以通过data传递,function中 event.data.* 来调用
$(“#id”).bind(“click”, { a: $(“#id”).val() } ,function(){alert(event.data.a)});
2. 全局变量
var a = $(“#id”).val();
$(“#id”).bind(“click”, function(){alert(a)});
3. 内部函数
$(“#id”).bind(“click”, function(){Say (“id”)});
function Say(id){alert( $(“#”+id).val() )}
四、Demo
demo01:
JQuery API对 $(document).ready() 的解释是:当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。
我的理解:$(document).ready() 用于当前页面加载完成后,就执行其定义的方法,用于异步加载,提交页面响影的速度,用于在一个页面中包含多个页面的情况(一个页面中使用多个iframe)。
1. 将页面中使用iframe的地方使用div代替;并定义div的ID属性。代码示例如下:
<div id="MyNoticesDiv" width="100%" height="195px"></div>
<script language="JavaScript" type="text/javascript">
$(document).ready(function(){
$.ajax({ url : '${base}/merchantHome/findMyNotices.action?merchantNoticeDto.limit=3',
type : 'post',
dataType : "text",
success : function(text) {
isPro = false;
if(null != text && "" != text){
$('#MyNoticesDiv').html(text); }
}
});
})
</script>
2.页面完成后,通过js再加载div中要显示的内容。
demo02
分享到:
相关推荐
`jQuery(document).ready()`函数是jQuery中的一个重要概念,它确保了在执行任何JavaScript代码之前,DOM已经完全加载和解析完成。这个特性使得开发者可以在不担心元素未定义的情况下操作DOM。以下是几种常见的表示...
在网页开发中,JavaScript 的 `$(document).ready()` 函数是一个非常重要的工具,它确保了在DOM(文档对象模型)完全加载并准备就绪后,才会执行包裹在其内的代码块。这有助于避免由于元素未加载而导致的错误,尤其...
$(document).ready(function(){…. })这个函数是用来取代页面中的[removed]; document.ready()和传统的方法<body onload=”load()”> 相似,不同的是onload()的方法是在页面加载完成后才发生,这包括DOM元素和...
在JavaScript和jQuery编程中,`$(document).ready`是一个常用的方法,用于确保DOM(文档对象模型)加载完毕后执行特定的函数。然而,有时我们可能会遇到`$(document).ready`被触发两次的情况,这通常会导致代码执行...
`document.ready`是jQuery库提供的一种方法,它的全称是`$(document).ready()`,它的主要作用是在DOM结构构建完成,但图像或其他资源可能尚未加载完毕的时候执行。这意味着,只要DOM树构建完成,`document.ready`...
$(document).ready(function(){ $(".menu ul li ul").hide(); $(".menu>ul>li>a").on('click',function(){ $(".menu>ul>li>a").css('background-image',"url('../image/collapsed.gif')"); $(".menu ul li ul...
本文着重讲解了在JQuery中使用$(document).ready()函数的详细方法和它的重要性。 在JQuery中,$符号是JQuery库的简写和引用。例如,$()函数等同于jQuery()函数。它为开发者提供了一种方便的方式来选择和操作文档中...
这个事件类似于基于 `document` 的 `deviceready` 事件,但它是专门为 Ionic 应用程序设计的,提供了更友好的跨平台兼容性。在 `$ionicPlatform.ready` 事件内部执行的代码可以确保在处理设备特定的功能或设置时不会...
在学习jQuery框架时,了解$(document).ready()函数的作用至关重要。这一函数是管理页面加载顺序和时机的核心部分,它确保了页面的DOM元素完全加载并可被脚本操作之后,才执行包裹在其中的代码。 ### 知识点:jQuery...
3. 使用jQuery的`$.holdReady(true)`和`$.holdReady(false)`组合,来控制`$(document).ready`的执行时机。 4. 如果可能,避免在frame中加载页面,或者确保frame内页面的资源都能正确访问。 理解`$(document).ready...
jQuery(document).ready(function(){}); 使用jQuery的好处是它包装了各种浏览器版本对DOM对象(javascript的DOM对象你应该知道吧,就是它了)的操作. 比如jquery写法:$(“div p”); // (1)$(“div.container”); // ...
在JavaScript和jQuery的世界里,`$(document).ready()`是一个非常重要的事件处理函数,它用于确保DOM(文档对象模型)完全加载后才执行指定的代码。这样可以避免在页面元素未加载完毕时尝试操作它们,从而可能导致...
### 使用JavaScript实现jQuery的`document.ready`功能 在前端开发中,经常需要用到DOM操作,而这些操作往往需要等到整个文档加载完成之后才能进行。在jQuery中,提供了非常方便的`$(document).ready()`方法来帮助...
从给定的文件内容中,我们可以提炼出一些知识点,包括Jquery的$(document).ready()的替代方法、浏览器的DOMContentLoaded事件、以及兼容性处理。 首先,文件中提到的更快的方法实际上是指一种JavaScript的编码实践...
$(document).Ready()方法 VS OnLoad事件 VS $(window).load()方法 接触JQuery一般最先学到的是何时启动事件。在曾经很长一段时间里,在页面载入后引发的事件都被加载在”Body”的Onload事件里. 对于Body的Onload事件...
这两个阶段分别对应了jQuery中的$(document).ready()方法和JavaScript的onload事件。 $(document).ready()是jQuery提供的一个方法,它允许我们在DOM结构完全加载并且解析后立即执行代码。在描述中提到,$(document)...