【JQuery】JQuery对象和DOM对象的区别，以及如何相互转化

示例

console.log($('#tellme'))
console.log($('#tellme')[0])

打印结果：

定义

DOM(Document Object Model):文档对象模型，模型被结构化为对象树，也就是我们常说的“DOM树”，应用原生js那一套。

JQuery对象：在JQuery库中，可以通过本身自带的方法获取页面DOM 元素的对象叫做JQuery对象。

定义不好理解，我们举个例子：

$('#tellme') 是一个JQuery对象、document.getElementById("tellme")是一个DOM对象

注意：jQuery对象不能使用DOM对象的方法，同理DOM对象也不能使用JQuery对象的方法，否则会报错，如下图所示

console.log($('#tellme').text())
console.log(document.getElementById("tellme").text())

在DOM对象里必须使用 document.getElementById("tellme").innerText ，来获取。

JQuery对象和DOM对象相互转化

一、JQuery对象 转 DOM对象

方法1、JQuery对象是一个数据对象，可以通过[index]，转化成DOM对象

$('#tellme')[0]

方法2、get() 方法：获得由选择器指定的 DOM 元素

$('#tellme').get(0)

二、 DOM对象 转 JQuery对象

将DOM对象通过 '$( )' 可以转成JQuery对象

$(document.getElementById("tellme"))

以上。