jQuery是一個優秀的、輕量級的js庫 ，它兼容CSS3，還兼容各種浏覽器（IE 6.0+, FF1.5+, Safari 2.0+, Opera 9.0+），而jQuery2.0及後續版本將不再支持IE6/7/8浏覽器。jQuery使用戶能更方便地處理HTML（標准通用標記語言下的一個應用）、events、實現動畫效果，並且方便地為網站提供AJAX交互。jQuery還有一個比較大的優勢是，它的文檔說明很全，而且各種應用也說得很詳細，同時還有許多成熟的插件可供選擇。
1、jQuery入口函數與Js入口函數的區別
【注】js入口函數指的是：window.onload = function(){};
區別一：書寫個數不同
Js入口函數只能出現一次，出現多次會存在事件覆蓋的問題。
jQuery的入口函數，可以出現任意多次，並不會存在事件覆蓋問題。
區別二：執行時機不同
Js入口函數是在所有的文件資源加載完成後，才執行。這些文件資源包括：頁面文檔、外部的js文件、外部的css文件、圖片等。
jQuery的入口函數，是在文檔加載完成後，就執行。文檔加載完成指的是：DOM樹加載完成後，就可以操作DOM了，不用等到所有的外部資源都加載完成。
文檔加載的順序：從上往下，邊解析邊執行。
2、jQuery對象和DOM對象的相互轉換
①DOM對象此處指的是：使用js操作DOM返回的結果
var btn = document.getElementById(“btnShow”); // btn就是一個DOM對象
②jQuery對象此處指的是：使用jQuery提供的操作DOM的方法返回的結果
var $btn = $(“#btnShow”); // $btn就是一個jQuery對象
③DOM對象轉換成jQuery對象
var $btn1 = $(btn); // 此時就把DOM對象btn轉換成了jQuery對象$btn1
// $(document）.ready(function(){}); // 調用入口函數
// 此處是將document這個js的DOM對象，轉換成了jQuery對象，然後才能調用jQuery提供的方法：ready
④jQuery對象轉換成DOM對象
// 第一種方式 var btn1 = $btn[0]; // 此時就把jQuery對象$btn轉換成了DOM對象btn1 （推薦使用此方式） // 第二種方式 var btn2 = $btn.get(0);// 此時就把jQuery對象$btn轉換成了DOM對象btn2
3、jQuery選擇器
符號（名稱） 說明 用法 基本選擇器（重點） # ID選擇器$(“#btnShow”).css(“color”, “red”);
選擇id為btnShow的一個元素（返回值為jQuery對象，下同）
. 類選擇器$(“.liItem”).css(“color”, “red”);
選擇含有類liItem的所有元素
element 標簽選擇器$(“li”).css(“color”, “red”);
選擇標簽名為li的所有元素
層級選擇器 空格 後代選擇器$(“#j_wrap li”).css(“color”, “red”);
選擇id為j_wrap的元素的所有後代元素li
> 子代選擇器$(“#j_wrap > ul > li”).css(“color”, “red”);
選擇id為j_wrap的元素的所有子元素ul的所有子元素li
基本過濾選擇器 :eq(index) 選擇匹配到的元素中索引號為index的一個元素，index從0開始$(“li:eq(2)”).css(“color”, ”red”);
選擇li元素中索引號為2的一個元素
:odd 選擇匹配到的元素中索引號為奇數的所有元素，index從0開始$(“li:odd”).css(“color”, “red”);
選擇li元素中索引號為奇數的所有元素
:even 選擇匹配到的元素中索引號為偶數的所有元素，index從0開始$(“li:odd”).css(“color”, “red”);
選擇li元素中索引號為偶數的所有元素
篩選選擇器（方法） （重點） find(selector) 查找指定元素的所有後代元素（子子孫孫）$(“#j_wrap”).find(“li”).css(“color”, “red”);
選擇id為j_wrap的所有後代元素li
children() 查找指定元素的直接子元素（親兒子元素）$(“#j_wrap”).children(“ul”).css(“color”,“red”);
選擇id為j_wrap的所有子代元素ul
siblings() 查找所有兄弟元素（不包括自己）$(“#j_liItem”).siblings().css(“color”, “red”);
選擇id為j_liItem的所有兄弟元素
parent() 查找父元素（親的）$(“#j_liItem”).parent(“ul”).css(“color”,“red”);
選擇id為j_liItem的父元素
eq(index) 查找指定元素的第index個元素，index是索引號，從0開始$(“li”).eq(2).css(“color”, “red”);
選擇所有li元素中的第二個