1.1.2 jQuery之美

jQuery带给我们的是JavaScript开发的革命。在没有脚本库的日子，开发脚本绝对是一件容易出错的工作，并且实现类似跨浏览器、页面动画效果等都属于高难度的应用，“救世主”jQuery有如下神力。

1. 提供了功能强大的脚本函数类库

使用这些功能函数, 能够帮助Web开发人员快速完成各种功能，而且会让代码异常简洁。比如，通过jQuery选择器一次选中页面上所有的Checkbox元素，通过each遍历选中的所有元素。

        $("*:checkbox").each(function() { });

2. 解决浏览器兼容性问题

JavaScript脚本在不同浏览器的兼容性问题一直是Web开发人员的噩梦，常常一个页面在IE 7、Firefox下运行正常，但在IE 6下就出现莫名其妙的问题。针对不同的浏览器编写不同的脚本是一件痛苦的事情。jQuery将开发人员从这个噩梦中拯救出来，比如jQuery中的event事件对象已经被格式化成所有浏览器通用，从前要根据event获取事件触发者，在IE下是event.srcElements而在Firefox等标准浏览器下是event.target。jQuery则通过统一event对象，可以在所有浏览器中使用event.target获取事件对象。当单击一个<a>元素时, 默认会链接到href属性中的地址，使用event.preventDefault()方法就可以取消此行为（浏览器默认行为）。

3. 实现丰富的UI

jQuery可以实现比如渐变弹出、图层移动等动画效果，这样可获得更好的用户体验。以渐变效果为例，从前为了写一个可以兼容IE和Firefox的渐变动画，要使用大量JavaScript代码实现。费心费力不说，写完后没有太多帮助，过一段时间就忘记了，再开发类似的功能还要再次费心费力。现在使用jQuery就可以快速完成此类应用。

jQuery UI就是用来帮助完成上面所有功能的jQuery插件库，除了实现效果外，其还提供了很多精美的主题和模板，可以实现在不改变任何代码的情况下更改样式风格。如图1-1所示为不同主题下的日历控件。

图1-1 不同主题的日历控件

图1-2和图1-3是使用dialog组件实现的对话框拖拽和拉伸效果。

图1-2 可拖拽

图1-3 可缩放

4. 优雅的链式编程方式

jQuery中，常常使用如下所示的链式方式编程：

        $("#myDiv").attr("title","myTitle").css("color","red");

上面的代码，首先获取到id为myDiv的元素，然后首先修改title属性，接着修改了CSS样式设置颜色为红色。jQuery这种链式编程方式十分优雅，而且更适合用来描述语意。在最新版本的Prototype中也已经开始借鉴jQuery的这种语法结构，但是就导致了Prototype有两套编码方法。而jQuery作为创造者，使所有使用jQuery的编码人员都能用最优雅的方式编写代码。

5. 学习简单，上手快

jQuery的学习成本非常低，因为jQuery是轻量级、灵活的脚本框架，并且其官方提供了丰富的在线文档和实例，任何人都可以轻松上手。

6. 太多了! 等待我们一一去发现