首页 > 语言 > JavaScript > 正文

JQuery 无废话系列教程(二) jquery实战篇上

2024-05-06 14:15:05
字体:
来源:转载
供稿:网友
我知道大家的想法, 放心好了,有些东西是不需要太多的理论知道做为基础, 其实在我们已经掌握JavaScript时,就已经掌握了JQuery的理论知识. 还是入门篇所说的那样,其实JQuery很简单. : )
在我们开始学习之前建议大家先去下载JQuery1.3中文参考. 下载地址
//www.Vevb.com/books/17812.html

好了,进入正题. 再次申明JQuery很简单,take easy!

    从那开始呢? 最好的切入地方就从 ready 函数开始!

    定义

    ready(fn);

    功能    

    这是事件模块中最重要的一个函数,因为它可以极大地提高web应用程序的响应速度。

    简单地说,这个方法纯粹是对向window.load事件注册事件的替代方法。通过使用这个方法,可以在DOM载入就绪能够读取并操纵时立即调用你所绑定的函数,而99.99%的JavaScript函数都需要在那一刻执行。

    有一个参数--对jQuery函数的引用--会传递到这个ready事件处理函数中。可以给这个参数任意起一个名字,并因此可以不再担心命名冲突而放心地使用$别名。

    请确保在 元素的onload事件中没有注册函数,否则不会触发$(document).ready()事件。

    可以在同一个页面中无限次地使用$(document).ready()事件。其中注册的函数会按照(代码中的)先后顺序依次执行。

     通过上面所述,我们可以把ready看做onLoad的替代方法. 这时有的朋友就会问了,有onLoad方法我们干什么还要用ready方法? 

     我个人的体会及看法是 onLoad缺点是以后维护起来麻烦,到处都是JavaScript代码,很容易出问题的哟! 在<<ppk谈JavaScript>>中,ppk针对这个问题的看法也是如此,尽量不要在标签中直接编写JavaScript 代码.

     实例

     两种编写方式

     一

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

     二

     var myFun = function(){alert("Hello World!");}

     $(document).ready(myFun);

    

     到这儿我想大家对ready的用法应该是明白了,但对前面的 $(document)应该很迷惑. 这是什么东东?别急... 现在只要记住这段代码的功能就是当整个文档载入完毕后再执行ready内的函数就够了.

     看完下面的代码我们就明白了$()的用法.

     index.html代码结构如下:

<html>
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选