JQuery源码学习——（一）JQuery起步

一、区分JQuery对象和DOM对象

$("#wrap").innerHTML = "文本"; // 错误  JQ对象不能调用DOM属性
getElementById("wrap").html("文本"); // 错误  DOM对象不能调用JQ对象的方法

二、JQ和DOM对象的相互转换

本质上两者都是操作DOM元素，但是，Jq对象是DOM元素的数组，也就是类数组。

1、Jq转为Dom对象

（1）数组下标法

　　　　　　var $li = $("li");  // 返回Jq对象　　　　　　var li = $li[0]; // 返回dom对象

(2) jq对象的get()方法

           var $li = $("li");           var li = $li.get(0); // 返回Dom对象

2、dom转为jq对象

可以将dom对象或dom元素数组传递给$()函数，$( )函数会将其包装为JQ对象，之后就可以使用jq方法了。如：

　　　　var li = getElementByTagName("li");　　　　var $li = $(li[0]); // 或者 $li = $(li);　　　　alert($li.html());

三、ready事件和load事件的区别

1、DOM文档加载的一般顺序

（1）解析HTML结构

（2）加载外部脚本和样式表文件

（3）解析并执行脚本CODE

（4）构造HTML DOM模型

（5）加载图片等外部部件

（6）页面加载完毕

2、ready事件先于load事件被激活

ready：在DOM绘制完毕之后被执行

load：网页中所有内容被全部加载完毕之后执行，缺点是：当文档已经被呈现，但由于网页数据还没有完全加载完毕，导致load 事件不能被触发。

3、load事件只能编写一次，如果重复多次，就只能处理最后一次的事件；ready可在同一个文档中被多次定义。

秒客网