jQuery 能做什么？

jQuery庫(kù)為Web腳本編程提供了通用(跨瀏覽器)的抽象層，使得它幾乎適用于任何腳本編程的情形。jQuery通常能為我們提供以下功能：

1、 方便快捷獲取DOM元素
如果使用純JavaScript的方式來(lái)遍歷DOM以及查找DOM的某個(gè)部分編寫(xiě)很多冗余的代碼，而使用jQuery只需要一行代碼就足夠了。例如，找到所有應(yīng)用了.content class樣式的div中所有的P標(biāo)簽，只需要下面的一行代碼：
$('div.content').find('p');

2、 動(dòng)態(tài)修改頁(yè)面樣式
使用jQuery我們可以動(dòng)態(tài)的修改頁(yè)面的CSS即使在頁(yè)面呈現(xiàn)以后。jQuery仍然能夠改變文檔中某個(gè)部分的類(lèi)或者個(gè)別的樣式屬性。例如，找到頁(yè)面所有的ul標(biāo)簽的第一個(gè)li子標(biāo)簽，然后為它們?cè)黾用麨閍ctive的樣式，代碼如下：
$('ul > li:first').addClass('active');

3、 動(dòng)態(tài)改變DOM內(nèi)容
使用jQuery我們可以很容易地對(duì)頁(yè)面DOM進(jìn)行修改，例如，為ID為"Container"的元素添加一個(gè)鏈接：
$('#container').append('<a href="more.html">more</a>');

4、 響應(yīng)用戶(hù)的交互操作
jQuery提供了截獲形形色色的頁(yè)面事件（比如用戶(hù)單擊某個(gè)鏈接）的適當(dāng)方式，而不需要使用事件處理程序拆散HTML代碼。此外，它的事件處理API也消除了經(jīng)常困擾Web開(kāi)發(fā)人員瀏覽器的不一致性。

 $('button.show-details').click(function() {
 $('div.details').show();
 });

上面的代碼表示：為使用的.show-details樣式的button元素添加一個(gè)click事件，事件就是：顯示使用.details樣式的DIV。

5、 為頁(yè)面添加動(dòng)態(tài)效果
jQuery中內(nèi)置的一批淡入、擦除之類(lèi)的效果，以及制作新效果的工具包，為此提供了便利。

 $(function () {
   $("#btnShow").click(function () {
     $("#msubject").hide("slow");
   });
 });

6、 統(tǒng)一Ajax操作
jQuery統(tǒng)一了多種瀏覽器的Ajax操作，使得開(kāi)發(fā)人員更多的專(zhuān)注服務(wù)器端開(kāi)發(fā)。

 function (data, type) {
    // 對(duì)Ajax返回的原始數(shù)據(jù)進(jìn)行預(yù)處理
 return data 
    // 返回處理后的數(shù)據(jù)
 }

7、簡(jiǎn)化常見(jiàn)的JavaScript任務(wù)。
除了這些完全針對(duì)文檔的特性之外，jQuery也改進(jìn)了對(duì)基本的javascript數(shù)據(jù)結(jié)構(gòu)（例如迭代和數(shù)組操作等）。

 $.each(obj, function(key, value) {
   total += value;
 });

jQuery 對(duì)象和 DOM 原生對(duì)象有什么區(qū)別？如何轉(zhuǎn)化？

• jQuery的對(duì)象用$('')來(lái)獲取
• DOM原生對(duì)象必須用javascript提供的方式，如document.getElementById(''),document.querySelector('')等方法獲取元素或數(shù)組
  這是原生的DOM對(duì)象：var btn = document.querySelector('#btn');
  DOM對(duì)象轉(zhuǎn)化為jQuery: $('btn')
  jQuery轉(zhuǎn)化為DOM對(duì)象：var btn = $btn[0]

jQuery中如何綁定事件？bind、unbind、delegate、live、on、off都有什么作用？推薦使用哪種？使用on綁定事件使用事件代理的寫(xiě)法？

• bind為一個(gè)元素綁定一個(gè)事件處理程序
• unbind從元素上刪除一個(gè)以前附加事件處理程序。
• delegate為所有匹配選擇器（selector參數(shù)）的元素綁定一個(gè)或多個(gè)事件處理函數(shù)，基于一個(gè)指定的根元素的子集，匹配的元素包括那些目前已經(jīng)匹配到的元素，也包括那些今后可能匹配到的元素。
• live附加一個(gè)事件處理器到匹配目前選擇器的所有元素，現(xiàn)在和未來(lái)。
• on在選定的元素上綁定一個(gè)或多個(gè)事件處理函數(shù)。
• off移除一個(gè)事件處理函數(shù)

推薦使用on 或off綁定或者移除事件處理函數(shù)

使用on綁定事件使用事件代理的寫(xiě)法:

$('#list').on('click', 'li', function() {
    //function code here.
});

jQuery 如何展示/隱藏元素？

• 展示：
  $('selector').show(duration,easing,complete);
  duration：動(dòng)畫(huà)持續(xù)多久
  easing：表示過(guò)渡使用哪種緩動(dòng)函數(shù)，jQuery自身提供"linear" 和 "swing"
  complete：在動(dòng)畫(huà)完成時(shí)執(zhí)行的函數(shù)
  本質(zhì)上show方法是修改元素的display為block。
• 隱藏：
  $('selector').hide(duration,easing,complete);
  參數(shù)同上（這里的speed表示從顯示到隱藏的速度），本質(zhì)上hide方法是修改元素的display為none。

jQuery 動(dòng)畫(huà)如何使用？

animate()方法用于創(chuàng)建自定義動(dòng)畫(huà)。
.animate({params}, speed, callback);

• params 定義形成動(dòng)畫(huà)的 CSS 屬性(動(dòng)畫(huà)結(jié)束后的CSS)必選
• speed 規(guī)定效果的時(shí)長(zhǎng).值:slow,fast或毫秒,可選
• callback 動(dòng)畫(huà)完成后所執(zhí)行的函數(shù),可選
• .delay()設(shè)置一個(gè)定時(shí)器，以延遲 執(zhí)行隊(duì)列中后續(xù)的項(xiàng)目。
• .clearQueue()從隊(duì)列中刪除所有還沒(méi)有運(yùn)行過(guò)的項(xiàng)目。
• .stop()在匹配的元素上停止當(dāng)前正在運(yùn)行的動(dòng)畫(huà)。
• .finish()針對(duì)匹配的元素 停止當(dāng)前 正在運(yùn)行的動(dòng)畫(huà)，刪除所有 隊(duì)列中的動(dòng)畫(huà)，并結(jié)束所有 動(dòng)畫(huà)

如何設(shè)置和獲取元素內(nèi)部 HTML 內(nèi)容？如何設(shè)置和獲取元素內(nèi)部文本？

獲取HTML內(nèi)容
$('p').html()
設(shè)置HTML內(nèi)容
$('p').html('這是一段文字')
獲取獲取元素內(nèi)部文本
$('p').text()
設(shè)置獲取元素內(nèi)部文本
$('p').text('這是一段文字')

如何設(shè)置和獲取表單用戶(hù)輸入或者選擇的內(nèi)容？如何設(shè)置和獲取元素屬性？

選擇input元素后，調(diào)用.val()即可獲取輸入的內(nèi)容；在.val()中傳遞參數(shù)即可設(shè)置input的內(nèi)容。
$(selector).val()
選擇元素后，調(diào)用attr(attribute,value)即可獲取元素置頂屬性的值，attribute參數(shù)為必填，代表了想要定位的屬性，而value參數(shù)選填，未填為查找，填寫(xiě)后代表修改為 將屬性值改為value
$(selector).attr(attribute,value)