1、js、jQuery區別：1、本質區別：a、js是網頁尾本語言，類似java是一種開發常用語言；

　　　　　　　　　　 jQuery是基於js語言封裝出來的一個前端框架；所以最本質的區別就是js是一種語言，而jQuery是基於該語言的一種框架。

　　　　　　　　　 2、用法區別：a、外觀上jQuery物件比js物件多了"$()"

　　　　　　　　　　　　　　　 b、操作屬性的方法不同

　　　　　　　　　　　　　　　 c、操作樣式時方法不同

　　　　　　　　　　　　　　　 d、使用JavaScript和jQuery分別載入DOM時。JavaScript只會執行一次，而jQuery會執行多次

　　　　　　　　　　　　　　　 e、js獲取id：document.getElementById(‘idName')；JQuery：$('#idName')

　　　　　　　　　　　　　　　 f、js獲取class的方法：document.getElementsByClassName；JQuery：$('.className')。

2、js常用選擇器：a：getElementById(ID): 返回對指定ID的第一個物件的引用，如果在文件中查詢一個特定的元素，最有效的方法是getElementById()。

　　　　　　　　 b：etElementsByName(name): 返回文件中name屬性為name值的元素，因為name屬性值不是唯一的，所以查詢到的結果有可能返回的是一個數組，而不是一個元素。

　　　　　　　　 c：getElementsByTagName(tagname): 返回文件中指定標籤的元素。

　　　　　　　　 d：getElementsByClassName():返回文件中所有指定類名的元素。

　　　　　　　　 e：getElementsByClassName():返回文件中所有指定類名的元素。

　　　　　　　　 f：querySelectorAll():返回文件中匹配指定css選擇器的第一個元素。

3、jQuery選擇器：a：基本選擇器：

　　　　　　　　　　ID選擇器：$(“＃myId”)選擇ID值等於myId的元素，id值不能重複在文件中，只能有一個id值是myId，所以得到的是唯一的元素。

　　　　　　　　　　標籤選擇器：$(＂div”)選擇所有的div標籤元素，返回div元素節點的陣列。

　　　　　　　　　　class選擇器：$(＂.myClass＂)選擇文件中所有使用myClass樣式的元素。

　　　　　　　　　　$(＂＊”)選擇文件中的所有的元素，可以運用多種的選擇方式進行聯合選擇：例如＄（＂＃myId，div，.myclass＂)

　　　　　　　　 b：層級選擇器：

　　　　　　　　　　$(＂form input＂)：選擇所有的form元素中的input元素。

　　　　　　　　　　$＂＃main＞＊＂)：選擇id值為main的所有的子元素。

　　　　　　　　　　$(＂label ＋ input＂)：選擇所有的1abe1元素的下一個input元素節點，經測試選擇晶返回的是label標籤後面直接跟一個input標籤的所有input標籤元素

　　　　　　　　　　$(＂＃prev～div＂)：同胞選擇器，該選擇器返回的為id為prev的標籤元素的所有的屬於同一個父元素的div標籤。

c：基本過濾選擇器（基本篩選器）：

　　　　　　　　　　$(＂tr：first＂)：選擇所有tr元素的第一個。

　　　　　　　　　　$("tr:last")：選擇所有tr元素的最後一個。

　　　　　　　　　　$(＂input：not（：checked）＋span＂)：過濾掉：checked的選擇器的所有的input元素。

　　　　　　　　　　$("tr:even")：選擇所有的tr元素的第0，2，4．．．．．．個元素（注意：因為所選擇的多個元素時為陣列，所以序號是從0開始）。

　　　　　　　　　　$(＂tr：odd＂)：選擇所有的tr元素的第1，3，5．．．．．．個元素。

　　　　　　　　　　$(＂td：eq（2）”)：選擇所有的td元素中序號為2的那個td元素。

　　　　　　　　　　$(＂td：gt（4）＂)：選擇td元素中序號大於4的所有td元素。

　　　　　　　　　　$("td：lt(4)")：選擇td元素中序號小於4的所有的td元素。

　　　　　　　　　　$(":header")：選擇所有的h1．．．．h6元素。

　　　　　　　　　　$("div:animated")：選擇正在執行動畫的＜div＞元素。

d、內容過濾選擇器：

　　　　　　　　　　$(＂div：contains（＇John＇）＂)：選擇所有div中含有John文字的元素。

　　　　　　　　　　$(＂td：empty＂)：選擇所有的為空（也不包括文字節點）的td元素的陣列。

　　　　　　　　　　$(＂div：has（p）＂)：選擇所有含有p標籤的div元素。

　　　　　　　　　　$("td:parent")：選擇所有的以td為父節點的元素陣列。

　　　　　　　　 e、視覺化過濾選擇器（可見性選擇器）：

　　　　　　　　　　$("div:hidden")：選擇所有的被hidden的div元素。

　　　　　　　　　　$("div:visible")：選擇所有的視覺化的div元素。

　　　　　　　　 f、屬性過濾選擇器：

　　　　　　　　　　$("div[id]")：選擇所有含有id屬性的div元素。

　　　　　　　　　　$(＂input［name＝＇newsletter＇］＂)：選擇所有的name屬性等於newsletter的input元素。

　　　　　　　　　　$(＂input［name！-＇newsletter＇］＂)：選擇所有的name屬性不等於＇newsletter＇的input元素。

　　　　　　　　　 $(＂input［name＾＝＇news＇］＂)：選擇所有的name屬性以＇news＇開頭的input元素。

　　　　　　　　　　$(＂input［name＄＝＇news＇］＂)：選擇所有的name屬性以＇news＇結尾的input元素。

　　　　　　　　　　$(＂input［name＊=＇man＇］＂)：選擇所有的name屬性包含＇news＇的input元素。

　　　　　　　　　　$(＂input［id］［name＄＝＇man＇］＂)：可以使用多個屬性進行聯合選擇，該選擇器是得到所有的含有id屬性並且那麼屬性以man結尾的元素。

　　　　　　　　g、子元素過濾選擇器：

　　　　　　　　　　$(＂div span：first-child＂)：返回所有的div元素的第一個子節點的陣列。

　　　　　　　　　　$(＂div span：last-child＂)：返回所有的div元素的最後一個節點的陣列。

　　　　　　　　　　$(＂div button：only—child＂)：返回所有的div中只有唯—個子節點的所有子節點的陣列。

　　　　　　　　h、表單元素選擇器：

　　　　　　　　　　$(":text")：選擇所有的text input元素。

　　　　　　　　　　$(＂：password＂)：選擇所有的password input元素。

　　　　　　　　　　$(＂：radio”)：選擇所有的radio input元素。

　　　　　　　　　　$(＂：checkbox＂)：選擇所有的checkbox input元素。

　　　　　　　　　　$(＂：submit＂)：選擇所有的submit input元素。

　　　　　　　　　　$(＂：image＂)：選擇所有的image input元素。

　　　　　　　　　　$(＂：reset＂)：選擇所有的reset input元素。

　　　　　　　　　　$(＂：button＂)：選擇所有的button input元素。

　　　　　　　　　　$(＂：file＂)：選擇所有的file input元素。

　　　　　　　　　　$(＂：hidden＂)：選擇所有型別為hidden的input元素或表單的隱藏域。

　　　　　　　　i、表單元素過濾選擇器：

　　　　　　　　　　$(":enabled")：選擇所有的可操作的表單元素。

　　　　　　　　　　$(":disabled")：選擇所有的不可操作的表單元素。

　　　　　　　　　　$(":checked")：選擇所有的被checked的表單元素。

　　　　　　　　　　$(＂select option：selected＂)：選擇所有的select 的子元素中被selected的元素。

　　　　　　　　j、其他選擇器：

　　　　　　　　　　＄（＂A B”）查詢A元素下面的所有子節點，包括非直接子節點。

　　　　　　　　　　＄（“A＞B”）查詢A元素下面的直接B子節點。

　　　　　　　　　　＄（“A＋B”）查詢A元素後面的兄弟節點，包括非直接子節點。

　　　　　　　　　　＄（“A～B”）查詢A元素後面的兄弟節點，不包括非直接子節點。

　　　　　　　　　　next（）；／／當前元素之後的緊鄰著的第一個兄弟元素（下一個）。

　　　　　　　　　　nextA11（）；／／當前元素之後的所有兄弟元素。

　　　　　　　　　　prev（）；／／當前元素之前的緊鄰著的兄弟元素（上一個）。

　　　　　　　　　　prevA11（）；／／當前元素之前的所有兄弟元素。

　　　　　　　　　　siblings（）；／／當前元素的所有兄弟元素。

　　　　　　　　　　不僅可以使用選擇晶進行進行絕對定位，還可以進行相對定位，只要在＄（）指定第二個引數，第二個引數為相對的元素。例如：＄（“u1”，＄（“div”）).

　　　　　　　　　　css(“background”,“red”);表示選擇在所有div元素節點下的u1元素。

4、js和jQuery物件之間的轉換：

　　　　　　　　　　a、js物件轉換成jquery物件。 $(js物件);

　　　　　　　　　　b、jquery物件轉換成js物件。 (1)jquery物件[索引值] (2)jquery物件.get(索引值).　　　　　　　　　

　　　　　　　　　　例：首先定義一個JQuery與js物件。var jq = $("#btn")；因為jQuery是js的方法集合 可以將jQuery當成偽陣列 運用陣列特點將之轉換。

　　　　　　　　　　jQuery --> js：(1). var js = jq[0]；或者使用get方法將之轉換：(2).var js = jq.get(0)。

　　　　　　　　　 js --> jQuery：最簡單的方法，運用$將js物件轉換 簡單粗暴：var jq = $(js);