jQuery对象与DOM对象

DOM对象

DOM是Document Object Model的简写，中文翻译为文档对象模型。

jQuery对象

jQuery对象是通过jQuery框架包装DOM对象之后产生的一个新对象，从本质上分析它仅仅是DOM对象的集合，因此可以把DOM对象看做是一个独立的个体，而jQuery可以是多个DOM对象组成的数据集合。

jQuery对象转换为DOM对象

jQuery对象不能使用DOM对象的方法，如果要使用DOM对象的方法，那么就需要把jQuery对象转为DOM对象。

有如下html结构

<ul>
  <li>列表1</li>
  <li>列表2</li>
  <li>列表3</li>
</ul>  

1. 借助数组下标来读取jQuery元素对象集合中的某个DOM元素对象

let $li = $("li");  //jQuery对象
let li = $li[0];  //DOM对象
console.log(li.innerHTML)

1. 借助jQuery对象的get()方法

let $li = $("li");  //jQuery对象
let li = $li.get(0);  //DOM对象
console.log(li.innerHTML);

把DOM对象转为jQuery对象

对于DOM对象来说，直接把它传递给$()函数即可，jQuery对象会自动把它包装为jQuery对象。

let li = document.getElementsByTagName("li");  //DOM对象
let $li = $(li);  //jQuery对象
console.log(li.html());