`

jQuery之入门(ready)

阅读更多
参考资料
1 jquery $(document).ready() 与window.onload的区别
http://www.jb51.net/article/21628.htm
2 jquery的$(document).ready()和onload的加载顺序
http://www.jb51.net/article/23653.htm
3 jQuery学习资料
http://www.blogjava.net/kissyan4916/category/42271.html
如无特别说明关于jQuery方面的东西使用版本都为:1.6.2
首先页面肯定引入jQuery的js库了
<script src="../scripts/jquery-1.6.2.min.js" type="text/javascript"></script>

以后就不在写这句话了,默认引入
关于jQuery中的ready函数是这样解释的,引用于:jQuery中文API
.ready( handler ):当DOM完全加载完成时,执行一个函数
window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行。
$(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕.

以下写法是等价的
//等待dom元素加载完毕.
$(document).ready(function(){
   alert("Hello World!");
});

//是上面的简写
$(function(){
	 alert("Hello World 2 !");
});

jQuery(document).ready(function(){
   alert("Hello World 3 !");
}); 

//以下是和其它库解决冲突的方法

//将变量$的控制权让渡给js库
jQuery.noConflict();				
jQuery(function(){					
  //在内部只能使用jQuery标记,不能使用$了,注意下面一种方式呀	
  alert("Hello World 4 !");
});

/*处理jQuery的$和别的库冲突的时候用的,通过jQuery.noConflict()这个方法,
 *我们就可以直接在代码中通过jQuery来代替$来使用
 */
jQuery.noConflict(); 
jQuery(function($){
  //在代码内部可使用$,不能在外面使用$
  alert("Hello World 5 !");
}); 

//自定义一个比较短快捷方式
var $j = jQuery.noConflict();		
$j(function(){						//使用jQuery
	alert("Hello World 6 !");
});

jQuery.noConflict();				
(function($){						//定义匿名函数并设置形参为$
	$(function(){					//匿名函数内部的$均为jQuery
		//继续使用 $ 方法
		alert("Hello World 7 !");
	});
})(jQuery);	//执行匿名函数且传递实参jQuery

//直接使用 jQuery ,没有必要调用"jQuery.noConflict()"函数。
jQuery(function(){  
    //内部代码使用jQuery 
	alert("Hello World 8 !");
});

如果页面有原生的widnow.onload的话,它会先执行jQuery的加载方法后,在去执行它
分享到:
评论

相关推荐

    jquery快速入门实例

    【jQuery 快速入门实例】 jQuery 是一个广泛使用的 JavaScript 库,它简化了 DOM 操作、事件处理和动画效果。本教程将引导你快速入门jQuery,通过基础实例帮助你掌握其核心概念。 ### 1. jQuery 构造函数与 $...

    jquery从入门到精通电子书下载

    ### jQuery:从入门到精通——理解与应用 #### 一、引言:jQuery的重要性与特点 **jQuery**,作为一款JavaScript脚本库,其地位在前端开发领域无可替代。它不仅简化了HTML文档遍历、事件处理、动态内容加载等常见...

    jquery从入门到精通课件

    《jQuery从入门到精通》是一门深度探讨JavaScript库jQuery的课程,主要针对想要提升Web开发技能,特别是希望简化DOM操作、实现动态效果和交互的开发者。jQuery是JavaScript的一个强大工具,它通过提供简洁的API,...

    jquery 入门帮助.pdf

    ### jQuery入门精要 #### 一、jQuery概览与崛起 **标题与描述解析:** "jquery 入门帮助.pdf"这一标题明确指向了对jQuery初学者的指导资料,而描述“对于了解ajax并初识jq的人很有帮助”则暗示了内容会涵盖jQuery...

    jQuery入门手册1.3.2

    **jQuery入门手册1.3.2** jQuery是一个广泛使用的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理、动画制作以及Ajax交互。这个“jQuery入门手册1.3.2”是针对初学者的指导性资料,旨在帮助读者快速...

    jQuery中文入门指南.pdf

    "jQuery中文入门指南.pdf" jQuery 是一个流行的 JavaScript 库,提供了许多有用的功能来简化 Web 开发。这个指南旨在为初学者提供一个详细的入门教程,教你如何使用 jQuery 库来开发 Web 应用程序。 首先,我们...

    jquery 从入门到精通 demo示例下载

    《jQuery:从入门到精通——实战Demo解析》 在Web开发领域,jQuery是一个不可或缺的JavaScript库,它极大地简化了DOM操作、事件处理、动画效果以及Ajax交互。本篇将通过介绍jQuery的基础概念、核心功能以及提供的...

    jQuery中文入门指南

    《jQuery中文入门指南》是一份面向初学者的教程,旨在帮助读者快速掌握jQuery的基本用法。该指南由Keel翻译并添加了补充说明,主要内容基于原文作者Jörn Zaefferer的作品。学习jQuery的过程中,建议参考两个重要的...

    jQuery中文入门指南.doc

    jQuery的核心概念之一是`$(document).ready()`函数,它确保在DOM完全加载后执行其中的代码。例如,在`custom.js`中,你可以看到这样的代码: ```javascript $(document).ready(function() { $("a").click(function...

    jquery学习入门教程

    《jQuery学习入门教程》是一份专为初学者设计的教程,旨在帮助读者快速掌握jQuery的基础知识和实用技巧。jQuery是一个广泛使用的JavaScript库,它简化了HTML文档遍历、事件处理、动画以及Ajax交互等任务,使得...

    jquery完美入门指南

    然后,理解$(document).ready()函数,它是jQuery中的一个关键事件,确保DOM加载完成后执行代码。此外,会介绍jQuery对象和DOM元素的区别以及如何选择元素,例如使用ID、类名或标签名选择器。 二、万能的选择器 在...

    JQUERY基础入门.PPTX

    ### jQuery基础入门知识点详解 #### 一、jQuery简介 ##### 1.1 什么是jQuery? - **起源与发展**:jQuery是由美国人John Resig在2006年创建的一个JavaScript库。随着时间的发展,该项目吸引了很多世界级的...

    jQuery-入门.pdf

    jQuery的入门通常从简单的元素选择和操作开始,例如选取页面上的某个元素,然后执行一个动作,如改变其内容或样式。 ```javascript &lt;!DOCTYPE html&gt; &lt;script src="jquery-1.3.2.min.js"&gt; $(document).ready...

    jquery初步入门学习小资料

    **jQuery 初步入门学习小资料** jQuery 是一个广受欢迎的 JavaScript 库,它极大地简化了 JavaScript 的使用,使得开发者可以高效地实现网页交互、动画效果以及与服务器的数据通信。这个压缩包文件提供了关于 ...

Global site tag (gtag.js) - Google Analytics