1. jQuery 能做什么？
首先jQuery是一個簡單、精簡、功能豐富的JavaScrip工具庫，他提供了易于使用且兼容性好的API，使用jQuery可以更加簡單的操作例如HTML文檔遍歷和操作、事件處理、Ajax、動畫等。
2. jQuery 對象和 DOM 原生對象有什么區別？如何轉化？
區別：
直接利用“===”進行判斷，結果為false
選擇的不同，jQuery對象要用jQuery方法選擇，DOM對象要用原生JS方法選擇
操作方法不同，jQuery對象要用jQuery方法操作，DOM對象要用原生JS方法操作
轉化：
對jQuery對象使用下標選擇可得到DOM原生對象，
例：$('xxx')[0] === document.querySelector('xxx')，結果為true對DOM原生對象使用$()可得到jQuery對象，雖然都是指向同一個對象，但是得到的jQuery對象和直接用jQuery方法選擇的對象不同
例：$(document.querySelector('xxx')) === $('xxx')，結果為false
3. jQuery中如何綁定事件？bind、unbind、delegate、live、on、off都有什么作用？推薦使用哪種？使用on綁定事件使用事件代理的寫法？
jQuery可以使用bind,live,delegate,on這四種方式進行事件監聽,還可以直接綁定例如a.click(function(){}); a.change(function(){})
對應的，移除一個事件的處理函數的方法：unbind,die,undelegate,off
用法：
$(selector).bind(events,[data],fn); 對單個目標元素進行監聽
$(selector).live(events,[data],fn); 效果和bind相同，但是運用到事件委托機制
$(selector).delegate(childSelector,events,[data],fn); 實現事件代理
$(selector).on(events,[childSelector],[data],fn); 可以實現以上所有功能，如單個目標元素的監聽，監聽多個目標
所以，推薦使用on
<!DOCTYPE html>
<html>
<head>
<title>demo</title>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
</head>
<body>
<ul>
<li>test1</li>
<li>test2</li>
<li>test3</li>
<li>test4</li>
<li>test5</li>
</ul>
<script>
$('ul').on('click','li',function(){
console.log(this)
})
</script> //對ul進行監聽，使用childSelector這個參數，對子元素進行事件綁定
</body>
</html>
4. jQuery 如何展示/隱藏元素？
可以使用添加刪除元素實現，可用的函數有append,appendTo,prepend,prependTo,before,insertBefor,after,insertAfter, 例：在div添加
$('div').append('<h1>title</h1>')； 刪除div$('div').remove()使用jQuery動畫相關的函數，hide,show,toggel,fadeIn,fadeOut,fadeToggle,slideDown,slideUp,slideToggle, 例：隱藏div，$('div').hide(), 展示div，$('div').show(); 或者直接使用$('div').toggle()即可實現展示和隱藏的切換
寫CSS，然后給目標元素添加相應的class達到展示/隱藏效果，$('div').addClass()
5. jQuery 動畫如何使用？
寫一個demo展示jQuery動畫用法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>demo</title>
<style>
.cnt {
width: 100px;
height: 100px;
background: red;
}
</style>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
</head>
<body>
<div class="cnt"></div>
<button class="hide">hide</button>
<button class="show">show</button>
<button class="toggle">toggle</button>
<button class="animate">自定義動畫</button>
<script>
var $cnt = $('.cnt')
$('.hide').click(function(){
$cnt.hide(4000,function(){
elart('已隱藏')
})
})
$('.show').click(function(){
$cnt.show(4000,fucntion(){
elart('已展示')
})
})
$('.toggle').click(function(){
$cnt.toggle(4000,function(){
elart('切換隱藏或展示')
})
})
$('.animate').click(function(){
$cnt.animate(
{
width: '+=100px',
height: '+=100px',
opacity: 0.25
})
.animate({
left: '+=200px'
})
.animate({
top: '+=200px'
})
.animate({
width: '-=100px',
height: '-=100px',
opacity: 1,
left: '-=200px',
top: '-=200px'
},4000)
})
$('.finish').click(function(){
$cnt.finish()
})
$('.stop').click(function(){
$cnt.stop(true,true)
})
</script>
</body>
</html>
6. 如何設置和獲取元素內部 HTML 內容？如何設置和獲取元素內部文本？
$('xxx').html(),不傳遞參數時獲取所選元素的HTML，當傳遞參數時，$('xxx').html(string), 則會替換原HTML內容。
$('xxx').text(),不傳遞參數時獲取所選元素的innerText,當傳遞參數時，$('xxx').text(string), 則會替換原元素下的innerText。
7. 如何設置和獲取表單用戶輸入或者選擇的內容？如何設置和獲取元素屬性？
$('input').val(),不傳遞參數時，獲取表單用戶輸入或選擇的內容，當傳遞參數時，$('input').val(string), 會修改input的value值為參數值。
獲取元素特定屬性的值 .attr(attributeName)
為元素屬性賦值 .attr(attributeName,value) / .attr(attributesJson) / .attr(attributeName,function(index,attr))
