《锋利的jQuery》读书笔记第一章(jQuery对象)

JavaScript库作用及对比

Prototype

    Prototype是的JavaScript库之一，对JavaScript的内置（String对象、Array等）做了大量的扩展。现在还有很多项目使用Prototype。Prototype可以看是好的、有用的JavaScript的组合在一起而形成的JavaScript库。使用者可以在需要的时候随时将其中的几段代码抽出来放进自己的脚本里。但是由于Prototype成型年代早，从整体上对于面向对象的编程思想把握不是很到位，导致了其结构的松散，不过现在Prototype也在慢慢改进。

Dojo

 Dojo的强大之处在于Dojo提供了很多其他JavaScript库所没有提供的功能。例如离线存储API、生成图标的组件、基于SVG/VML的矢量图形库和Comet支持等等。Dojo是一款非常适合企业级应用的JavaScript库、并且得到了IBM、SUN和BEA等一些大公司的支持。但是Dojo的缺点也是很明显的：学习曲线陡，文档不齐全。最严重的就是API不稳定。每次升级都可能导致已有的程序失效，但是自从Dojo的1.0.0版出现以后，情况有所好转，Dojo还是一个很有发展潜力的库。

YUI

 YUI是有Yahoo公司开发的一套完备的、扩展性良好的富交换网页程序工具集。YUI封装了一系列比较丰富的功能。例如DOM操作和Ajax应用等，同时还包括了几个核心的CSS文件。该库本身文档及其完备，代码编写也非常规范。

Ext JS

 Ext JS常简称为Ext，原本是对YUI的一个扩展，主要用于创建前端用户界面，如今已经发展到可以利用包括jQuery在内的多种JavaScript框架作为基础库，而Ext作为界面的扩展库来使用。Ext可以用来开发富有华丽外观的富客户端应用，能使B/S应用更加具有活力。但是由于Ext侧重于界面，本身比较臃肿，所以使用之前先权衡利弊。另外，需要注意的是，Ext并非完全免费，如果用于商业用途，需要付费获得授权许可。

MooTools

  MooTools是一套轻量、简介、模块化和面对对象的JavaScript框架。MooTools的语法几乎跟Prototype一样，但却提供了更为强大的功能、更好的扩展性和兼容性。其模块化思想非常优秀，核心代码大小只有8KB.无论用到哪个模块都可即时导入，即时是完整版大小也不超过160KB.MooTools完全彻底的面向对象的编程思想。语法简介直观，文档完善，是一个非常不错的JavaScript库。

jQuery

 jQuery同样是一个轻量级的库，拥有强大的选择器，出色的DOM操作，可靠的事件处理、完善的兼容性和链式操作等优点。

jQuery的优势：

1. 轻量级
2. 强大的选择器
3. 出色的DOM操作的封装
4. 可靠的事件处理机制
5. 完善的Ajax
6. 不污染顶级变量
7. 出色的浏览器兼容性
8. 链式操作方式
9. 隐式迭代
10. 行为层与结构层的分离
11. 丰富的插件支持
12. 完善的文档

window.onload和$(document).ready(）的对比

区别 window.onload $(document).ready 执行时机 必须等待网页中所有的内容加载完毕后（包括图片）才能执行 网页中所有DOM结构绘制完毕后就执行，可能DOM元素关联的东西并没有加载完 编写个数 不能同时编写多个一下代码无法正常执行: window.onload = function() { alert("test1")}; window.onload = function() {alert("test2");结果只会输出”test2” 能同时编写多个一下代码正确执行：$(document).ready(function() {alert("Hello world!")}); $(document).ready(function() {alert("Hello again!")});结果两次都输出 简化写法 无 可以简写成：$(function(){//…});

jQuery对象

jQuery对象就是通过jQuery包装DOM对象后产生的对象。
jQuery对象是jQuery独有的。如果一个对象是jQuery对象，那么就可以使用jQuery里的方法。例如

$("#foo").html(); //获取id为foo的元素内的html代码。.html（）是jQuery里的方法

这段代码等同于：

document.getElementById("foo").innerHTML;

在jQuery对象中无法使用DOM对象的任何方法。

jQuery对象和DOM对象的相互转换

1.jQuery对象转成DOM对象
（1）
var $cr = $("#cr"); //jQuery对象
var cr = $cr[0]; //DOM对象
（2）
var $cr = $("#cr");//jQuery对象
var cr = $cr.get(0);//DOM对象
2.DOM对象转成jQuery对象
var cr = document.getElementById("cr");//DOM对象
var $cr = $(cr);//jQuery对象

解决jQuery和其他库的冲突

1. jQuery库在其他库之后导入
2. jQuery库在其他库之前导入