首页 > 编程笔记 > JavaScript笔记 阅读:10

jQuery是干什么的(非常详细)

jQuery 是一个简洁、快速、灵活的 JavaScript 脚本库。

jQuery 是由约翰·雷西格(John Resig)于 2006 年创建的,它帮助人们简化了 JavaScript 代码。由于 jQuery 简便易用、文档非常丰富,因此它已被大量开发人员所推崇。jQuery 的核心理念是“Write less,do more!”,即倡导写更少代码,做更多事情。

使用 jQuery 可以极大地提高编写 JavaScript 代码的效率,让编写出来的 JavaScript 代码更加简洁、健壮。同时网络上丰富的 jQuery 插件也让开发人员的工作变得更为轻松,让项目的开发效率有了质的提升。

jQuery的应用

使用 jQuery 可以非常方便快捷地获取 DOM 元素、动态地修改页面样式、动态地改变 DOM 内容、及时响应用户的交互操作、为页面添加动态效果、统一 AJAX 操作、简化常见的 JavaScript 任务。

在 Web 2.0 时代,jQuery 还受到许多网站的青睐,例如海尔官网、京东网上商城、去哪儿网等,许多网站都应用了 jQuery。下面我们就来看看使用 jQuery 实现的绚丽效果。

1) 海尔官网应用jQuery的效果

海尔官网的一级导航分为五大类:智慧生活、个人与家用产品、商业解决方案、用户服务、购买。在一级导航上可以看到应用了 jQuery 实现鼠标指针移入、移出的效果。当鼠标指针移入并悬浮在这些一级导航上面时,可以显示相应的二级导航;当鼠标指针移出一级导航时,二级导航会隐藏起来,以实现一级导航和二级导航的联动效果,如下图所示。


图 1 海尔官网应用jQuery的效果

2) 京东网上商城应用jQuery的效果

京东网上商城有很多的产品类目,为了将这些产品类目以清晰明了的方式展示给用户,京东网上商城采用手风琴式导航的方式来展示所有产品类目。手风琴式导航采用纵向导航的方式,首先列出产品的大类目,然后根据鼠标指针悬浮的效果展示出所有产品的小类目,这也是 jQuery 应用的一个经典实现。

如下图所示,将鼠标指针移入并悬浮在家用电器产品大类目上,展示出家用电器的所有产品小类目:


图 2 京东网上商城应用jQuery的效果

3) 去哪儿网应用jQuery的效果

网站的首页中经常有一个以幻灯片轮播形式展示广告图片的广告栏,这也是很多网站会采用的一种设计方式。在有限的区域内展示多张广告图片,只能以幻灯片轮播形式来实现。

如下图所示,该广告栏就是应用 jQuery 的幻灯片轮播插件实现的:


图 3 去哪儿网应用jQuery的效果

jQuery 不仅适合网页设计师、开发人员以及编程爱好者使用,而且适合在校师生使用,可以说 jQuery 适合用于任何应用 JavaScript 的地方。

jQuery的特点

jQuery 是一个简洁、快速的 JavaScript 脚本库,它能让人们在网页上简单地操作文档、处理事件、运行动画效果或者添加异步交互。

jQuery 可以提高编程的效率,它的主要特点如下:

1) 代码精致小巧

jQuery 是一个轻量级的 JavaScript 脚本库,其代码非常精致小巧。在网络盛行的今天,提高网站用户的体验度显得尤为重要,代码精致小巧的 jQuery 完全可以做到这一点。

2) 功能函数强大

过去人们在编写 JavaScript 代码时,如果没有良好的编程基础,很难写出复杂的 JavaScript 代码。

JavaScript 是不可编译的语言,在复杂的程序结构中调试错误是一件非常痛苦的事情,这大大降低了开发效率。jQuery 的功能函数能够帮助开发人员快速地实现各种功能,而且会让代码简洁、结构清晰。

3) 跨浏览器

JavaScript 代码的浏览器兼容问题一直是 Web 开发人员的噩梦,经常出现页面在 Chrome 浏览器下运行正常,但在 Firefox、IE 或者其他浏览器下却不兼容的情况,这就需要开发人员在一个功能上针对不同的浏览器编写不同的脚本代码,这无疑是一件非常痛苦的事情。

jQuery 成功地将开发人员从这个噩梦中解放出来,现如今浏览器兼容问题或许已经没有那么严重,但是不同厂商的浏览器或多或少仍然存在兼容问题。jQuery 具备良好的兼容性,可兼容各大主流浏览器,如 IE 6.0+、Firefox 1.5+、Safari 2.0+、Opera 9.0+ 等。

4) 链式的语法风格

jQuery 可以对元素的一组操作进行统一的处理,不需要重新获取对象,也就是说其可以基于一个对象进行一组操作。这种方式精简了代码量,减小了页面体积,有助于浏览器快速加载页面,提高用户的体验度。

5) 对DOM对象封装

jQuery 封装了 DOM 对象的常用操作。本来使用 DOM 对象的操作需要很多代码完成的功能,使用 jQuery 可以轻松完成,大大降低了难度、减少了代码量。

6) AJAX操作完善

jQuery 将所有的 AJAX 操作封装到一个函数 $.ajax() 中,使得开发人员在处理 AJAX 的时候能够专心处理业务逻辑而无须关心复杂的浏览器兼容问题以及 XMLHttpRequest 对象的创建和使用问题。

7) 文档丰富

jQuery 的文档非常丰富,很多热爱 jQuery 的团队都在努力完善 jQuery 的中文文档,例如 jQuery 的中文 API。

8) 开源

jQuery 是一款开源的产品,任何人都可以自由地使用并提出修改意见。

9) 插件丰富

jQuery 的易扩展性吸引了来自全球的开发人员编写 jQuery 的扩展插件。

目前,jQuery 已经有上百种官方支持的插件,而且还不断有新的插件出现。除了 jQuery 本身带有的一些功能外,开发人员可以通过插件实现更多的功能,例如表单验证、拖放效果、Tab 导航条、表格排序、树形菜单以及图像特效等。

网上的 jQuery 插件很多,读者可以直接下载、使用,并且插件是将 JavaScript 代码和 HTML 代码完全分离的,便于维护。

jQuery的版本

1) jQuery 1.0

2) jQuery 2.0

3) jQuery 3.0.0

4) jQuery 4.0.0


以上列出的是 jQuery 重要版本的发布时间及主要变化。除此之外,jQuery 还有一些小范围的升级版本,读者如果有兴趣,可以查看 jQuery 官方网站说明。

相关文章