$选择器是怎么将DOM封装成jquery对象

这篇文章主要介绍了$选择器是怎么将DOM封装成jquery对象，具有一定借鉴价值，需要的朋友可以参考下。希望大家阅读完这篇文章后大有收获。下面让小编带着大家一起了解一下。

创新互联公司是专业的大东网站建设公司，大东接单;提供成都做网站、成都网站设计,网页设计,网站设计,建网站,PHP网站建设等专业做网站服务;采用PHP框架,可快速的进行大东网站开发网页制作和功能扩展;专业做搜索引擎喜爱的网站,专业的做网站团队,希望更多企业前来合作!

前言：说到jquery不得不说的就是强大的jquery的选择器功能啦。该功能很强大，还单独分离出来sizzle模块供只需用到选择器功能的朋友使用。（该篇先不说jquery选择器的强大功能，先说说jquery是如何将DOM元素封装成jquery对象的）

一、Dom对象和jquery对象

测试

运行结果：

从中我们就可以看出区别了，$()把DOM对象封装成jquery对象，而DOM对象也就保存在jquery[0]中，这也就是为什么我们说的把jquery对象转化成DOM对象只需用jquery[0]或者jquery.get(0)了。

二、模拟jquery--根据id，封装jquery对象

这里先简化一下，看看封装jquery对象的一部分过程

测试

②输出结果:（火狐浏览器上打开的）

这里需要注意的是，chrome浏览器在显示上有会些不同

jquery显示的是类数组对象形态。

③、解析

对于上面代码有很多看不明白的朋友建议看一下我前面写的文章【jquery源码】开始学习源码之前需要解决的一些问题。

正则匹配我是直接复制了源码中的正则，可以输出该正则处理后的结果来看看。

三、模拟jquery--根据标签名，封装jquery对象

直接上代码

 
    
测试1
    
测试2
    
测试3
    
测试4

输出结果：

这里只是单纯的模拟，jq处理起来远远没有那么简单，jquery还进行了大量的判断（下面的文章会继续说这个问题）。还可以在jquery对象中发现prevObject属性，该属性保存的是上一级的查找对象。看看下面的例子就能明白了。

 
    
测试1
    
测试2
    
测试3
    
测试4

感谢你能够认真阅读完这篇文章，希望小编分享$选择器是怎么将DOM封装成jquery对象内容对大家有帮助，同时也希望大家多多支持创新互联，关注创新互联行业资讯频道，遇到问题就找创新互联，详细的解决方法等着你来学习!