《鋒利的JQuery》第二版閱讀筆記-第一章
jQuery對象和DOM對象
????想學(xué)習(xí)jQuery，首先要學(xué)會(huì)區(qū)分jQuery對象和DOM對象。1）jQuery對象是用jQuery類庫的選擇器獲得的對象。2）DOM對象是用傳統(tǒng)（javascript）獲得的對象。舉個(gè)栗子
//DOM對象
var domO = document.getElementById("id");
//JQuery對象：$jqueryO，這里的$是可以省略不寫的，是習(xí)慣寫上，一看就知道是jquery對象。
var $jqueryO = $("#id");
????其次，jQuery對象不能使用DOM對象的方法，DOM對象也不能使用jQuery對象的方法。不過，這兩個(gè)對象是可以相互轉(zhuǎn)化的。
//由于jQuery對象是一個(gè)數(shù)組對象，所以可以通過下標(biāo)轉(zhuǎn)DOM
var $jqueryO = $("#id");
//方法1
var jToD = $jqueryO[0];
//方法2
var jToDT = $jqueryO.get(0);
//DOM轉(zhuǎn)JQuery
var domO = document.getElementById("id");
var $domToJ = $(domO);
jQuery的優(yōu)勢與特點(diǎn)
????學(xué)習(xí)了jQuery和DOM對象的區(qū)別后，讓我們來了解一下jQuery引得如此多人使用的魅力所在。
- 一，小。jQuery分為開發(fā)和生產(chǎn)(min.js)兩個(gè)版本。其中生產(chǎn)版本大約30kb左右。
- 二，選擇器強(qiáng)大。它不僅支持css的，還支持jQuery獨(dú)創(chuàng)的，還有用戶自定義的。不知道你是否有何我一樣的疑問。選擇器又是什么？這里的選擇器主要指的是CSS選擇器。舉個(gè)栗子：
#main{width:600px}，如這個(gè)是個(gè)id選擇器（根據(jù)元素id屬性），目的是找尋網(wǎng)頁中id為main的元素并設(shè)置寬度為600px。與此同時(shí)還有標(biāo)簽選擇器(元素標(biāo)簽名稱，如div body)，類選擇器(元素class屬性)。 - 三，DOM封裝的十分好，使用jQuery時(shí)，不用考慮javascript的復(fù)雜元素，比如XMLHttpRequest
- 四，事件處理機(jī)制可靠周到，這個(gè)我們后面一起學(xué)習(xí)
- 五，ajax封裝的好。原生的會(huì)比較復(fù)雜，具體請看下面圖（來源于一篇精彩的文章）
原生：
在這里插入圖片描述
jQuery
在這里插入圖片描述 - 六 ，不污染頂級(jí)變量。一般我們見到的jQuery變量、函數(shù)都位于
$function({});之內(nèi)?？梢耘c其他的的$function({});等共存。 - 七，jQuery修復(fù)了一些瀏覽器之間的差異，封裝了不少優(yōu)秀插件，有豐富的文檔可以參考，而且還開源。
- 八 ，因?yàn)閖Query對象本身是數(shù)組，所以其方法可以自動(dòng)操作對象集合。其次，還可以進(jìn)行鏈?zhǔn)讲僮?如：.attr().submit())。
Hello World!
????只要學(xué)會(huì)Hello World，就仿佛掌握了一們語言?，F(xiàn)在，讓我們學(xué)習(xí)使用jQuery，向世界say Hello。
????第一步，下載jquery.js。本書使用的是1.7，可以從這里下載。
????第二步，引入與使用。注意，引入要在調(diào)用前哦，不然是無法使用的。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
<script src="../jquery-1.7.2/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){//等待Dom元素加載完畢
alert("hello world!")//彈框
});
$(function(){//$(document).ready簡寫，可以同時(shí)執(zhí)行
alert("hello again");
});
</script>
</head>
<body>
</body>
</html>
