1.jQuery的引入：本地下載jQuery(後面簡稱jq)的源文件，開發版本使用非min版，線上使用min版，zepto.js類似，同樣的一些基於jq的插件也是如此用法，如果使用requreJs也就是模塊化加載注意插件的依賴性；zepto.js（可以認為是移動端簡版jq,用法基本相同，唯一不同的是點擊事件的觸發，一個是click,一個touch)
2.注意事項點：jq的使用是基於我們的選擇器去綁定方法從而實現交互效果的。jq常用的方法如下：
$('選擇器').html()，如果html不傳值則是獲取這個選擇器的html文本，如果傳值'',是去掉選擇器包裹的html,相同的用法是text()
$('選擇器').hide() 隱藏選擇器的dom結點，其實質就是行內添加樣式style='display:none';show(),相反的效果，toggle(),則是兩者來回切換，但是一般用於顯示時，需要觸發其他顯示和隱藏，比如點擊tab切換；
修改class的操作 addClass(),removeClass(),toggleClass() 切換類 hasClass()是否有類型：boolear
修改標籤的屬性attr()：添加自定義屬性，removeAttr()：刪除屬性
修改樣式的操作css() :其傳入值是key,value鍵值對，或者對象
dom選擇 parent() :父級元素 ；。prev()前面的元素;next()後面的元素；after(),before()方法在被選元素前插入指定的內容 ;slibings() 兄弟元素；remove(),刪除
數據請求：ajax()
3.面向對象的封裝
面向對象的思想其實不是很複雜，就是根據我們的業務或者開發劃分的模塊，比如nav，swiper,toats,登錄驗證等；從字面入手，面向對象首先需要我們暴露一個對象出來，供大家使用，這個暴露的對象依賴誰很重要，下面轉盤插件以示例說一下我們如何封裝一個插件對象（感謝懶人之家）
我們需要再自己的獨立的js中加入立即執行函數，這個插件是依賴於jq的，所以傳入了jQuery,利用$.fn.extend()綁定我們新的屬性和方法，如果插件中需要傳入一下參數，我們也可以使用這個方法生成我們最後的對象
以上是一種，還有一種簡單的粗暴的寫法
(function(exports){
var keyBoard = function(params){
var defaults = {
width:100,
height:100,
};
//合併使用插件初始化參數
var optionsCur = extend(defaults,params);
//初始化,
keyBoard.prototype.init = function(optionsCur){
}
// 這個我們可以添加其他的方法，依據插件的功能
exports.KeyBoard = keyBoard;
}
})(window)
這些技術如何學習，有沒有免費資料？
對前端的技術，架構技術感興趣的同學關注我的頭條號，並在後臺私信發送關鍵字：“前端”即可獲取免費的架構師學習資料
知識體系已整理好，歡迎免費領取。還有面試視頻分享可以免費獲取。關注我，可以獲得沒有的架構經驗哦！！
閱讀更多 前端攻城小牛 的文章
