1.什么是jQuery
write less,do more切平，js庫(kù)
2.jQuery版本區(qū)別
- 1.x 兼容ie8以前版本扳躬，官網(wǎng)只做Bug維護(hù)锅减，功能不再新增糖儡，文件比較大
- 2.x 不兼容ie8以前版本，官網(wǎng)只做Bug維護(hù)怔匣，功能不再新增握联，文件相對(duì)于1.x較小
- 3.x 不兼容ie8以前版本，只支持最新瀏覽器每瞒，很多jQuery老插件不支持金闽，提供不包含Ajax/動(dòng)畫API版本，文件相對(duì)于1.x較小
- 版本選取剿骨，查看多個(gè)知名網(wǎng)站：淘寶代芜，京東，使用的jQuery版本是1.x浓利，因此可以建議使用1.x
3.jQuery引入
-
服務(wù)器本地引入
-
下載jQuery
官網(wǎng)下載 地址
-
npm 包管理器下載
npm install --save jquery
-
本地引入jQuery
<script src="./node_modules/jquery/dist/jquery.js"> </script>
-
-
CDN引入
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.9.1/jquery.js"></script>
4.jQuery入口函數(shù)
$(function() {
...// 此處是頁(yè)面DOM加載完成的入口
})
// 第二種方式
$(doucument).ready(function () {
...// 此處是頁(yè)面DOM加載完成的入口
})
- 當(dāng)DOM結(jié)構(gòu)渲染完畢即可執(zhí)行內(nèi)部代碼
- 相當(dāng)于js中的DOMContentLoaded
5.jQuery頂級(jí)對(duì)象$
- $是jQuery的別稱
- $是jQuery的頂級(jí)對(duì)象
6.jQuery對(duì)象和DOM對(duì)象
原生Js獲取的對(duì)象就是DOM對(duì)象
jQuery方法獲取到的元素就是jQuery對(duì)象
jQuery對(duì)象本質(zhì):利用$對(duì)DOM對(duì)象包裝后產(chǎn)生的對(duì)象(偽數(shù)組形式存儲(chǔ))
jQuery對(duì)象只能使用jQuery方法挤庇，js只能使用Js方法
-
由于jQuery只是對(duì)js常用的方法和屬性進(jìn)行了封裝，但是對(duì)于某些沒有的屬性的時(shí)候需要轉(zhuǎn)換為js贷掖，一般通過jQuery方便獲取屬性嫡秕，接著將jQuery對(duì)象轉(zhuǎn)換為js對(duì)象
-
DOM對(duì)象轉(zhuǎn)換為jQuery對(duì)象
$(DOM對(duì)象); let div = document.querySelector('div'); $(div); -
jQuery對(duì)象轉(zhuǎn)換為DOM對(duì)象
$('div')[index];// index是索引號(hào) // 或者 $('div').get(index); // 以上寫法主要在于jQUery對(duì)象是偽數(shù)組，對(duì)DOM對(duì)象的封裝
-
7.零碎知識(shí)
-
$(this)表示jQuery當(dāng)前元素 -
show()表示顯示羽资，hide()表示元素隱藏
