1： 說說庫和框架的區別？
庫(Library簡稱Lib)，庫是封裝好的代碼，通過調用開放出來的API獲取相應的功能，需要什么就從庫中調用什么，相對自由，不需要復雜的代碼和加工。類似于工具，簡化流程。
框架（Framework），框架是為解決一個（一類）問題而開發的產品，框架一般只需要使用框架提供的類或函數，即可實現全部功能，使用框架時，一般要使用這個框架的所有代碼。類似于一個模板，內部可根據不同需求，添加、填充元素。
2： jquery 能做什么？
jqery是一個快速的小的，功能豐富的JS庫，使用方便的API，擁有便捷的插件擴展機制和豐富的插件。定義了一套選擇器規則，和CSS選擇器目的一樣，都是為了選擇出符合特定規則的元素。
jQuery可以實現原生DOM元素的功能，提高效率，簡化代碼。
jQuery封裝了很好的API，可以方便的進行事件處理，解決了瀏覽器兼容的問題。
jQery的設計宗旨是“write less ,Do more”,即寫很少的代碼，做更多的事情，它封裝JavaScript常用的功能代碼，提供一種簡便的JavaScript設計模式，優化HTML文檔操作、事件處理、動畫設計和Ajax交互。
3： jquery 對象和 DOM 原生對象有什么區別？如何轉化？
jquery 對象是通過 jquery 包裝DOM對象后產生的對象。
二者的區別是：1、jqery選擇器得到的jqery對象和標準的js中document.getElementByid()得到的dom對象是兩種不同的類型。
2、jquery無法使用DOM對象的任何方法（屬性），DOM對象也無法使用jquery的方法（屬性）。
3、jQuery對象是一個類數組對象。代碼和操作更為簡單，兼容性更好。
二者轉化：
jQuery對象轉化成DOM對象，兩種轉換方式：[index]和.get(index)
var $btn=$("#btn")//jQuery對象；
var btn=$btn[0]//DOM對象；
var btn=$btn.get(0)//DOM對象；
DOM對象轉化成jQuery對象,只需要用$()把DOM對象包裝起來，即可得到jQuery對象
var btn=document.getElementById('#btn');//DOM對象
var $btn=$(btn);//jQuery對象
4：jquery中如何綁定事件？bind、unbind、delegate、live、on、off
都有什么作用？推薦使用哪種？使用on綁定事件使用事件代理的寫法？
bind(type,[data],fn)：為事件類型綁定處理程序
unbind():注銷特定類型的指定事件處理程序函數，只能注銷bind()和相關jquery方法注冊的事件處理程序。
delegate(selector,[type],fn)將監聽事件綁定在就近的父元素上，為被選的子元素添加一個或多個事件處理程序
live(type,[data],fn)綁定事件的方式和bind()一樣，但是并沒有將事件綁定到this上，而是利用了委托機制來完成事件的監聽處理，把節點的處理委托給了document,新添加元素的話不用重新綁定事件
on(type,[selector],[data],fn)將監聽事件綁定在就近的父元素上，為被選的子元素添加一個或多個事件處理程序
off(type,[selector],[data],fn)移除用on綁定的事件處理程序
其中，bind、unbind、delegate、live都是jquery1.7之前的版本，現在推薦使用on和off
//普通事件綁定
$('div').on('click',function(){
console.log(this)});
//事件代理
$('div').on('click','span',function(){
console.log(this)});
5：jquery 如何展示/隱藏元素？
show()顯示出隱藏的元素
hide()隱藏元素
toggle()切換元素的可見狀態，如果被選元素可見，則隱藏這些元素，如果被選元素隱藏，則顯示這些元素
slideDown()以滑動的方式隱藏元素
css的div的style屬性設置
var $box=$('.box');
$box.css('display','none');
$box.css('display','box');
6： jquery 動畫如何使用？
以下事件中：duration表示動畫持續多久，easing表示過渡使用哪種緩動函數，jQuery自身提供swing和linear,complete在動畫完成時執行的函數。
1、.hide/show/toggle([duration][,easing][,complete])隱藏/顯示/切換隱藏顯示元素。
2、.fadeIn/fadeOut/fadeToggle([duration][,easing][,complete])通過淡入的方式顯示匹配元素/淡出的方式隱藏元素/匹配元素的不透明度動畫，來顯示或隱藏 .fadeTo(duration,opacity[,easing][,complete])調整匹配元素的不透明度做動畫效果。
3、.slideDown/slideUp/slideToggle([duration][,easing][,complete])，用滑動動畫顯示/隱藏/顯示或隱藏
4、.animate(properties[,duration][,easing][,complete])
5、.stop([clearQueue][,jumpToEnd])停止匹配元素當前正在運行的動畫。
7：如何設置和獲取元素內部 HTML 內容？如何設置和獲取元素內部文本？
設置和獲取內部HTML內容
var html=$('#div').html();
$('#div').html('<div>hello world!</div>');
設置和獲取內部文本內容
var html=$('#div').text();
$('#div').text('<div>hello world!</div>');
8：如何設置和獲取表單用戶輸入或者選擇的內容？如何設置和獲取元素屬性？
設置和獲取表單用戶輸入或者選擇的內容即獲取input的value值
var value=$('#username').val();
$('#username').val('hello');
設置和獲取元素屬性
var value=$('#username').val();
$('.class').attr('src','http:// ');
9： 使用 jquery實現如下效果
代碼 ：http://js.jirengu.com/gamequxuto/1/edit?html,output
Ps:當點擊按鈕時使用如下數據
var products = [ { img: 'http://img10.360buyimg.com/N3/jfs/t2242/92/1446546284/374195/9196ac66/56af0958N1a723458.jpg', name: '珂蘭 黃金手 猴哥款', price: '￥405.00' },{ img: 'http://img10.360buyimg.com/N3/jfs/t2242/92/1446546284/374195/9196ac66/56af0958N1a723458.jpg', name: '珂蘭 黃金轉運珠 猴哥款', price: '￥100.00' },{ img: 'http://img10.360buyimg.com/N3/jfs/t2242/92/1446546284/374195/9196ac66/56af0958N1a723458.jpg', name: '珂蘭 黃金手鏈 3D猴哥款', price: '￥45.00' }];
