JQ的对象与dom的对象（.eq()与[]的区别）

首先我们假设一个html中有以下元素：

<div class="sel"></a>
<div class="sel"></a>
<div class="sel"></a>
 

使用JQ选择元素的时候

$('.sel')//我们选择了三个元素
$('.sel').eq(0)//我们选择了第一个div，它是一个JQ对象，不可以使用dom属性和方法
$('.sel')[0]//我们也是选择了第一个div，但是这是一个dom对象，可以使用dom属性方法，但不可以使用JQ的属性方法

$('.sel').eq(0)[0]//选择第一个div并转换为dom对象，同上
$('.sel')[0].eq(0)///错误，dom对象无法使用JQ方法，因为.eq()是JQ的方法
 

 

那么，JQ的对象与dom的对象有什么区别呢？

DOM对象
DOM对象是通过面向对象的方式描述的文档模型模型
通过DOM可以访问所有的HTML元素，创建新的元素以及修改删除元素及其属性
JQuery对象
JQuery对象是一个Javascript数组
数组包含的信息
jquery 当前的JQuey框架版本号
length 指示这个数组的元素个数
context 一般指向htmlDocument对象
selector 传递进来的选择器内容
JQuery对象是通过JQuery对象包装DOM对象产生的对象，是JQuery独有的，所以JQuery对象不能使用DOM方法。反之，DOM对象不能使用JQuery方法。
两者之间的转换

var domElement = $(".sel")[0];
//JQuery转换为Dom对象
var jqElement = $(domElement);
//Dom对象转化为JQuery对象

//获取JQuery对象
var jqElement = $("id");
//获取dom对象
var domElement = document.getElementById("id");