請注意 JQuery 對象與 DOM 對象 是不同的
<p id="test"></p>
<p id="test2"></p>
var test = document.getElementById('test');
var $test2 = $('#test2');
其中
test是 DOM對象，而$test2是JQuery 對象
但是兩者又是可以轉換的
1.JQuery 對象轉換為 DOM 對象
利用數(shù)組下標的方式讀取到jQuery中的DOM對象
<div>元素1</div>
<div>元素2</div>
<div>元素3</div>
var $div = $('div')//$div 是jquery 對象
console.log($div);
![]()
01.jpg
01.jpg
JQuery 對象是一個類數(shù)組對象，可以看到它的數(shù)組對象最前面的值就是 DOM 對象，所以可以通過 數(shù)組下標的方式將 JQuery 對象轉換為 Dom 對象献酗。
<p id="_id"></p>
<p class="_class"></p>
var $pp = $('p');
console.log($pp);
02.jpg
可以看到JQuery 數(shù)組對象的前兩個值是 DOM 對象恳邀，所以可以通過
$pp[0],$pp[1]來分別獲得<p id="_id"></p>,<p class="_class"></p>的兩個DOM 對象。
<span id="test1"></span>
<i class="test2"></i>
var $test1 = $('#test1');
console.log($test1);
var $test2 = $('.test2');
console.log($test2);
04.jpg
可以通過下標 0 來分別獲取浪慌，
id和class
通過的JQuery 自帶的 get() 的方法
jQuery對象自身提供一個.get() 方法允許我們直接訪問jQuery對象中相關的DOM節(jié)點笼恰，get方法中提供一個元素的索引
var $div = $('div') //jQuery對象
var div = $div.get(0) //通過get方法踊沸，轉化成DOM對象
div.style.color = 'red' //操作dom對象的屬性
- 將 DOM 對象轉換為 JQuery 對象
通過
$(DOM)的方法可以將一個 JQuery 對象轉換為一個 Dom 對象。
如果傳遞給$(DOM)函數(shù)的參數(shù)是一個DOM對象社证，jQuery方法會把這個DOM對象給包裝成一個新的jQuery對象
<div>元素1</div>
<div>元素2</div>
<div>元素3</div>
var div = document.getElementsByTagName('div');
var div1 = div[1];
console.log(div1);
console.log($(div1));
$(div1).css('color','gold');
05.jpg
