無論是看 jQuery 官方文檔驹愚,還是《鋒利的jQuery》想邦,里邊都提醒一點:
jQuery 對象 DOM 對象不一樣,一樣的是都可以操作 DOM永毅。
感謝慕課網(wǎng)的 jQuery 課程把跨,提供了一個非常好的例子來說明兩者的區(qū)別。
首先沼死,創(chuàng)建兩個 id 不同的 p 元素:
<p id="demo1"></p>
<p id="demo2"></p>
使用原生 JavaScript 給 demo1 元素添加文本內(nèi)容和樣式
var p = document.getElementById('demo2');
p.innerHTML = "Hello,World";
p.style.color = "red";
通過 document.getElementById 獲取 DOM 元素着逐,然后給其 innerHTML 和style 屬性賦值,這是直接操作 DOM 處理文本與樣式意蛀。
使用 jQuery 給 demo2 元素添加文本內(nèi)容和樣式
$(document).ready(function() {
$('#demo1').html('Hello耸别,jQuery!').css('color','green');
});
jQuery則是通過 $('#demo1') 方法獲取一個 jQuery 對象县钥,然后通過 jQuery 對象的 html() 和 css() 方法來操作文本與樣式秀姐。
總結(jié):
1. 原生 JavaScript 通過找到元素直接操作DOM;
2. jQuery 則是通過內(nèi)置方法操作DOM若贮。