1. jQuery的概述
1.1 jQuery的概念
jQuery是一個快速、簡潔的JavaScript庫，其設計的宗旨是“Write Less，Do More”
jQuery主要是封裝了JavaScript常用的功能代碼，優化了DOM操作、時間處理、影片設計和Ajax互動，
學習jQuery的本質就是：學習呼叫這些函式（方法）
jQuery出現的目的就是加快前端人員的開發速度，我們可以灰常方便地呼叫以及使用它，從而提高開發效率
jQuery與原生js形象比喻
1.2 jQuery的優點
- 輕量級，核心檔案才幾十kb，不會影響頁面加載速度
- 跨瀏覽器兼容，基本兼容了現在的主流瀏覽器
- 鏈式編程，隱式迭代
- 對事件、樣式、影片支持，大大優化了DOM操作
- 支持插件擴展開發，有著豐富的第三方的插件，例如：樹形選單、日期控制元件、輪播圖等
- 免費、開源
2. jQuery的基本使用
2.1 jQuery的下載
官網網址：https://jquery.com/
版本資訊：
1x：兼容IE678等低版本的瀏覽器，官網不再維護更新
2x：不兼容IE678等低版本的瀏覽器，官網不再維護更新
3x：不兼容IE678等低版本的瀏覽器，官網主要維護更新的版本
所有版本的下載網址：https://code.jquery.com/
2.2 jQuery的使用步驟
1.引入jQuery檔案
<script type=”text/javascript” href=https://www.cnblogs.com/Jim-Wang/p/”jquery.min.js”></script>
其中jquery.min.js是你所下載下來的jQuery檔案
2.使用即可
2.3 jQuery的入口函式
$(function(){
… //此處是頁面DOM加載完成的入口
//等著頁面DOM加載完畢再去執行js代碼
});
$(document).ready(function(){
… //此處是頁面DOM加載完成的入口
//等著頁面DOM加載完畢再去執行js代碼
});
- 等著DOM結構渲染完畢即可執行內部代碼，不必等到所有外部資源加載完成，jQuery幫我完成了封裝，
- 相當于原生js中的DOMContentLoaded
- 不同于原生js的load事件是等頁面檔案、外部的js檔案、css檔案、圖片加載完畢才執行內部代碼
- 推薦使用第一種
2.4 jQuery的頂級物件 $
1. $是jQuery的別稱，在代碼中可以使用jQuery代替$，但一般為了方便，通常直接使用$
$(function(){
alert(11);
});
jQuery(function(){
alert(11);
});
以上代碼的結果是一樣的
2. $是jQuery的頂級物件，相當于原生js中的window物件，把元素利用$包裝成jQuery物件就可以呼叫jQuery的方法
2.5 jQuery物件和DOM物件
1. 利用原生js來獲取的物件就是DOM物件
var myDiv = document.querySelector(‘div’); //myDiv 是DOM物件
2. 用jQuery方式獲取的物件就是jQuery物件，
$(‘div’); // $(‘div’)是jQuery物件
3. jQuery物件的本質：利用$把DOM物件包裝后產生的物件（偽陣列形式存盤）
4. jQuery物件只能使用jQuery方法，DOM物件則使用原生js的屬性以及方法
myDiv.style.display=’none’;//正常執行
$(‘div’).style.display=’none’;//執行時會報錯
$(‘div’).hide();//正常執行
myDiv.hide();//執行時會報錯
- DOM物件與jQuery物件之間是可以相互轉換的
（1） 因為原生js比jQuery更大，原生的一些屬性和方法jQuery沒有給我封裝，要想使用這些屬性和方法則需要把jQuery物件轉換為DOM物件才能使用，
l DOM物件轉換為jQuery物件 $(DOM物件)
$(‘div’);
l jQuery物件轉換為DOM物件（兩種方式）
$(‘div’)[index] index是索引號
$(‘div’).get(index) index是索引號
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/28089.html
標籤：jQuery
上一篇：layui常用的驗證