jQuery是继prototype之后又一个优秀的JavaScript框架。它是轻量级的js库，它兼容CSS3，还兼容各种浏览器 （IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+）。jQuery使用户能更方便地处理HTML documents、events、实现动画效果，并且方便地为网站提供AJAX交互。jQuery还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择。jQuery能够使用户的html页保持代码和html内容分离，也就是说，不用再在html里面插入一堆js来调用命令了，只需定义id即可。
如何搭建jQuery环境？
下载jQuery文件库及js文件，你可以在jQuery的官方网站上去下载，当前最新的版本是：jquery-1.7.1.min.js，下载地址是：http://jquery.com
用jQuery的前提,首先要在你的页面引用一个jQuery文件库：
<script type="text/javascript"src="/JavaScript/jquery-1.7.1.min.js"></script>这个就是我们网站的jQuery应用，其中src表示你的jQuery文件库存放位置，这里面的代码不要深究，其实就是用js封装的。自己也能封装。
jQuery与JavaScript相比优势有哪些？
1.代码更简洁。例题：实现页面数据的隔行变色功能。
用JavaScript实现如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>使用JavaScript实现隔行变色</title>
<style type="text/css" >
body{
font-size:12px; text-align:center
}
#tbStu1{
width:260px; border:solid 1px #666; background-color:#eee
}
#tbStu1 tr{ line-height:23px}
#tbStu1 tr th{background-color: #66FF00; color:#fff}
#tbStu1 .trOdd{background-color: #FF0000; color:#fff}
</style>
<script type="text/javascript" language="javascript">
window.onload=function(){
var oTb=document.getElementById("tbStu1");
for(var i=0;i<oTb.rows.length-1;i++){
if(i%2){
oTb.rows[i].className="trOdd";
}
}
}
</script>
</head>
<body>
<table id="tbStu1" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<th>学号</th> <th>姓名</th> <th>性别</th><th>总分</th>
</tr>
<!--奇数页 -->
<tr>
<td>1001</td><td>张小明</td><td>男</td><td>320</td>
</tr>
<!--偶数页 -->
<tr>
<td>1002</td><td>李明琪</td><td>女</td><td>350</td>
</tr>
<!--奇数页 -->
<tr>
<td>1003</td><td>高飞</td><td>男</td><td>310</td>
</tr>
<!--偶数页 -->
<tr>
<td>1004</td><td>刘燕</td><td>女</td><td>300</td>
</tr>
<!--奇数页 -->
</tbody>
</table>
</body>
</html>
用jQuery实现如下：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>使用JavaScript实现隔行变色</title>
<script language="javascript" type="text/javascript" src="../Jscript/jquery-1.7.1.min.js"></script>
<style type="text/css" >
body{
font-size:12px; text-align:center
}
#tbStu{
width:260px; border:solid 1px #666; background-color:#eee
}
#tbStu tr{ line-height:23px}
#tbStu tr th{background-color: #66FF00; color:#fff}
#tbStu .trOdd{background-color: #FF0000; color:#fff}
</style>
<script type="text/javascript">
$(function(){
$("#tbStu tr:nth-child(even)").addClass("trOdd");
})
</script>
</head>
<body>
<table id="tbStu" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<th>学号</th> <th>姓名</th> <th>性别</th><th>总分</th>
</tr>
<!--奇数页 -->
<tr>
<td>1001</td><td>张小明</td><td>男</td><td>320</td>
</tr>
<!--偶数页 -->
<tr>
<td>1002</td><td>李明琪</td><td>女</td><td>350</td>
</tr>
<!--奇数页 -->
<tr>
<td>1003</td><td>高飞</td><td>男</td><td>310</td>
</tr>
<!--偶数页 -->
<tr>
<td>1004</td><td>刘燕</td><td>女</td><td>300</td>
</tr>
<!--奇数页 -->
</tbody>
</table>
</body>
</html>
显然用jQuery代码更加的简洁，简单执行的效果更高的优点。如上例题，虽然JavaScript代码可以实现最终的效果，但是循环页面的元素会影响打开的速度，并且代码较为复杂，而用jQuery（选择器）则可以快速的定位页面中的元素，并且设置该元素的相应属性，具有代码简单，执行效率高的优点。
2.完善的检测机制
在传统的JavaScript代码中，定位页面中元素时，如果页面中不存在该元素，那么浏览器将提示运行出错信息，影响后续代码的执行，因此在JavaScript中为了避免显示这样的出错信息，先要检测该元素是否存在，然后运行其属性或事件代码，从而导致代码的冗余，影响执行的效率。
在jQuery选择器定位页面元素的时候，无需考虑所定位的元素在页面是否存在，及时该元素不存在，浏览器也不提示出错信息，极大地方便了代码的执行效率。
分享到：
相关推荐
jQuery简单应用实例
jQuery的表单简单应用 让你清晰易懂，还有不少习题，帮你巩固基础，加深理解。
JQuery的简单应用(环境:Sql Server 2005+Visual 2005),是一个不错的Jquery的学习例子。
jquery的简单应用。可运行网页.希望对初学者对于jquery的理解有所帮助
jquery-1.3.1.js的开发简单应用，学习使用，
首先引入JQuery文件库只需将文件导入页面中即可，即在<head></head>中，接下来详细介绍，感兴趣的朋友可以了解下
jquery仿IPad应用的实例...包含简单的效果和动画
jQuery简单应用,包括选择器的简单使用,简单方法的使用,如LOAD,LINK等
今天要分享给大家的是9款完美体验的HTML5/jQuery应用，这些基于HTML5和jQuery的应用都比较实用，而且也相对比较华丽，当然，这需要你使用支持HTML5的浏览器，一起来看看。 1、jQuery动画图标菜单导航 仿苹果样式 ...
jquery应用和学习,包括简单的例子和帮助.
今天的这款jQuery焦点图插件看起来非常简单，但是无论从外观和实用价值上看都相当不错。这款jQuery焦点图的图片是横向滚动的，两侧均有左右滑动按钮。 在线演示 源码下载 3、jQuery幻灯片播放焦点图插件 这又是一...
通过简单的案例来学习，分析代码为什么这么写，其实是上手编程的最佳选择，本案例就是一些简单易懂的案例，为你打造坚实的jQuery基础，涉及jQuery的各个方面，很值得学习和收藏！ 本例包含： 1.认识jQuery 2....
CH1 & CH2 施工完毕，较为简单的案例已略过 原书的案例使用JQ2.X的版本实现的，这里就使用3.6重写了，省略了一些重复的案例。 - 大部分的API从使用方法上来说还是差不多的 - 有几个案例不知道是不是因为版本不同的...
php+php+jquery(bootstrap)应用 的简单应用，登陆注册页面，无数据库连接
前 言 第1章 jquery开发入门/1 1.1 jquery概述/2 1.1.1 认识jquery /2 1.1.2 jquery基本功能/2 1.1.3 搭建jquery开发环境/3 1.1.4 编写第一个简单的jquery应用/3 1.1.5 jquery程序的代码风格/5 1.2 jquery...
《Web开发典藏大系：jQuery网页开发实例精解》是一本...jquery应用于页面开发、如何产生页面元素特效等都进行了细致入微的讲解。这必将使每一个阅读本书的 读者少走弯路，快速上手，建立用jquery进行开发网页的信心。
jQuery适合于设计师、开发者以及那些还好者，同样适合用于商业开发，可以说jQuery适合任何JavaScript应用的地方，可用于不用的应用程序。 jQuery是一个轻量级的脚本，其代码非常小巧，JavaScript包只有15K左右。 ...
jquery下jstree简单应用 - v1.0.docx
struts2~json~gson~jquery~ajax简单应用
面向javascript基础比较差的程序员，讲解使用javascript和jQuery的实现简单的表单应用。