JQuery内核学习-图解JQuery对象

在jquery中.jQuery对象是一个很奇特的东西.之所以奇特.主要表现在它的生成方式上.第一它不是使用new方式构建出来的.new出来也没意义.你可以自己去试试看.它只是使用了一个$()就完事了,这里并不讨论jqurey对象是怎么构建出来的.而是学习一下它的本质.它是什么东西.从数据结构方面来说.它有点类似于js的数组.可是它不是数组.那些length属性也是jquery之父模拟出来的.那么它究竟是什么:下面我画了一张图.也许能够窥探一下究竟(点击图片查看大图).

$("div,span,h1,table").attr("style","background:0xFF0000");的时候.jquery会进行上面图示的步骤,事实上jquery可以说是一个存储了dom元素的仓库, 举个例子.

var o = {"url":"www.frongdig.com","name":"前端发掘"}

平时我们访问一个对象的时候,可以使用这种方法:o["url"] 那么你访问jquery对象(记住,jquery对象是一个集合.一个dom仓库),所以可以使用这样来访问$("div,span,h1,table")[0].如果你alert($("div,span,h1,table")[0].tagName),会输出div.如果你有认真看上面的图例的话.就会发现jquery大概就是这样的一个数据类型{0:div,1:span,2:h1,3:table},当然,jquery也有封装方法来取得dom,就是get(index),这个方法其实和我们上面用下标来访问是一样的.看到这里,是不是就大概清楚了jquery到底是什么了呢?那么设置属性的时候.为什么能批量的设置呢.这也是归功于jquery的原型方法each,它会遍历你那个"仓库"的所有dom对象.并且对每一个dom对象进行操作.事实上.图例也清楚的展示了.这篇文章既然说是图解.那就不要太多文字了.期待下一篇图解吧.