jQuery 入门教程(1): 概述

青旅半醒 2024-02-17 14:10 44阅读 0赞

**jQuery**是一套跨[浏览器][Link 1]的[JavaScript][][函式库][Link 2]，简化[HTML][]与JavaScript之间的操作，下面为摘自Wikepedia上的jQuery说明：

jQuery 是[开源软件][Link 3]，使用[MIT许可证][MIT]授权。[\[4\]][4] jQuery的语法设计使得许多操作变得容易，如操作文档对象（document）、选择[DOM][]元素、创建[动画][Link 4]效果、处理[事件][Link 5]、以及开发[Ajax][]程序。jQuery 也提供了给开发人员在其上创建[插件][Link 6]的能力。这使开发人员可以对底层交互与动画、高级效果和高级主题化的组件进行抽象化。模块化的方式使 jQuery 函数库能够创建功能强大的[动态网页][Link 7]以及[网络应用程序][Link 8]。

jQuery有下列特色:

*  跨浏览器的[DOM][DOM 1]元素选择
 *  [DOM][DOM 1]巡访与更改：支援[CSS][] 1-3与 基本的[XPath][]，jQuery 1.2版以后默认取消[XPath][]支持，改为插件支持
 *  事件（Events）
 *  [CSS][]操纵
 *  特效和动画（移动显示位置、淡入、淡出）
 *  [Ajax][Ajax 1]
 *  延伸性（Extensibility）
 *  工具：例如浏览器版本和`each`函数。
 *  [JavaScript][]插件
 *  轻量级

有很多应用程序开发框架中已经集成了jQuery，如前面介绍的[PHP Yii Framework][] 和 [Java EE Vaadin Web应用开发框架][Java EE Vaadin Web] ，这些框架可以不使用JavaScript而是使用PHP或是Java来使用jQuery的UI功能。但了解jQuery JavaScripts编程对于更好编写Web页面还是有很大的帮助的，[微软][Link 9]和[诺基亚][Link 10]已宣布在他们的平台上绑定jQuery。[\[5\]][5] 微软最初在[Visual Studio][]中集成了jQuery[\[6\]][6]以便在微软自己的 [ASP.NET AJAX][] 框架和[ASP.NET MVC Framework][] 中使用。因此如果你从事ASP.Net或是Sharepoint Web Part或是Application Page开发了解jQuery尤为重要，本教程帮助初学者了解jQuery的基本开发，从而为进一步学习其它Web编程打好基础。

本教程使用Visual Studio为开发工具，你也可以使用你自己喜欢的开发IDE，Visual Studio支持Javascript的调试，jQuery使用目前的最新版本jquery-1.9.1.js.下载到本地。

使用Visual Studio创建一个Website，将下载下来的jquery-1.9.1.js 放在scripts

[![20130304001][]][20130304001]

添加的Default.html具有如下代码框架作为后续示例的基础：

**\[html\]** [ view plain][view plain] [copy][view plain] [print][view plain] [?][view plain]

1.  <!doctype html>
2.  <html>
3.  <head>
4.  <meta charset="utf-8">
5.  <title>JQuery Demo</title>
6.  </head>
7.  <body>
8.  
9.  <script src="scripts/jquery-1.9.1.js"></script>
10. <script>
11. 
12. // Your code goes here
13. 
14. </script>
15. </body>
16. </html>

[Link 1]: http://zh.wikipedia.org/wiki/%E7%80%8F%E8%A6%BD%E5%99%A8
[JavaScript]: http://zh.wikipedia.org/wiki/JavaScript
[Link 2]: http://zh.wikipedia.org/wiki/%E5%87%BD%E5%BC%8F%E5%BA%AB
[HTML]: http://zh.wikipedia.org/wiki/HTML
[Link 3]: http://zh.wikipedia.org/wiki/%E5%BC%80%E6%BA%90%E8%BD%AF%E4%BB%B6
[MIT]: http://zh.wikipedia.org/wiki/MIT%E8%AE%B8%E5%8F%AF%E8%AF%81
[4]: http://zh.wikipedia.org/wiki/JQuery#cite_note-4
[DOM]: http://zh.wikipedia.org/wiki/%E6%96%87%E6%A1%A3%E5%AF%B9%E8%B1%A1%E6%A8%A1%E5%9E%8B
[Link 4]: http://zh.wikipedia.org/wiki/%E5%8A%A8%E7%94%BB
[Link 5]: http://zh.wikipedia.org/w/index.php?title=%E4%BA%8B%E4%BB%B6_%28%E8%AE%A1%E7%AE%97%E6%9C%BA%29&action=edit&redlink=1
[Ajax]: http://zh.wikipedia.org/wiki/AJAX
[Link 6]: http://zh.wikipedia.org/wiki/%E6%8F%92%E4%BB%B6
[Link 7]: http://zh.wikipedia.org/wiki/%E5%8B%95%E6%85%8BHTML
[Link 8]: http://zh.wikipedia.org/wiki/%E7%BD%91%E7%BB%9C%E5%BA%94%E7%94%A8%E7%A8%8B%E5%BA%8F
[DOM 1]: http://zh.wikipedia.org/wiki/DOM
[CSS]: http://zh.wikipedia.org/wiki/CSS
[XPath]: http://zh.wikipedia.org/wiki/XPath
[Ajax 1]: http://zh.wikipedia.org/wiki/Ajax
[PHP Yii Framework]: http://www.imobilebbs.com/wordpress/%e6%95%99%e7%a8%8b/yii-framework-%e5%bc%80%e5%8f%91%e6%95%99%e7%a8%8b
[Java EE Vaadin Web]: http://www.imobilebbs.com/wordpress/%e6%95%99%e7%a8%8b/vaadin-web%e5%ba%94%e7%94%a8%e5%bc%80%e5%8f%91%e6%95%99%e7%a8%8b
[Link 9]: http://zh.wikipedia.org/wiki/%E5%BE%AE%E8%BD%AF
[Link 10]: http://zh.wikipedia.org/wiki/%E8%AF%BA%E5%9F%BA%E4%BA%9A
[5]: http://zh.wikipedia.org/wiki/JQuery#cite_note-2008-09-28-5
[Visual Studio]: http://zh.wikipedia.org/wiki/Visual_Studio
[6]: http://zh.wikipedia.org/wiki/JQuery#cite_note-6
[ASP.NET AJAX]: http://zh.wikipedia.org/wiki/ASP.NET_AJAX
[ASP.NET MVC Framework]: http://zh.wikipedia.org/wiki/ASP.NET_MVC_Framework
[20130304001]: http://www.imobilebbs.com/wordpress/wp-content/uploads/2013/03/201303040011.png
[view plain]: http://blog.csdn.net/mapdigit/article/details/8635630#