jQuery編程實(shí)踐總結(jié)(一)

加載jQuery

我覺得加載jQuery這個在很多小型網(wǎng)站,或者做外包的話就沒有必要放到CDN,我主要考慮的因素是加載的文件是否多,服務(wù)器速度,以及面向的用戶群體。而且放到CDN上面,有時(shí)候你不會知道cdn上的版本是否更新了,存在不穩(wěn)定因素。而且現(xiàn)在還有很多站點(diǎn)需要兼容ie8-,所以選擇固定的jQuery1.8.0可以判斷出瀏覽器版本;

  1. 將jQuery和頁面用到的js文件盡量全部放在</body>之前;
  1. 根據(jù)實(shí)際境況和業(yè)務(wù)需要選擇引用jQuery的方式,CDN or 本地服務(wù)器;
  2. 需要兼容ie8+的話選擇jQuery v1.8.3 ,如果不需要考慮兼容性就放心的使用2.0+版本吧
  3. 使用$(function(){頁面所有需要用到的js,除組件外});

變量

  1. jQuery變量最好加一個$前綴;
  1. 將經(jīng)常用到的jQuery變量存儲起來以方便重用;
  2. 使用駝峰命名;
  3. ID父親容器下面再查找子元素請用.find()方法。這樣做快的原因是通過id選擇元素不會使用Sizzle引擎;//這個沒有親測,不過貌似無法反駁~
  4. 指定上下文;
  5. 不要用*選擇器,盡量多用children(),find()等;
  6. 多使用IIFE ,匿名函數(shù)自調(diào)用,避免變量污染;
 var $box = $(".box"); //2.將選擇的dom存到變量里面
 $('.class', '#sasasasa'); //5.在指定的id下選擇

DOM操作相關(guān)

  1. 不要處理不存在的元素,盡量先判斷是否存在在操作;
  1. 在執(zhí)行動畫時(shí)候先stop()再開始;
  2. 盡量避免 少創(chuàng)建對象,多利用data-屬性來存取對象;對象只創(chuàng)建一次或者初始化一次;
  3. 多使用鏈?zhǔn)秸{(diào)用,特別的給自定義的函數(shù)如果不需要返回值也加上this,方便鏈?zhǔn)秸{(diào)用;

事件相關(guān)

  1. 可以盡量使用聲明的函數(shù)作為回調(diào)函數(shù);
  1. 不要把綁定事件寫在html腳本里面,結(jié)構(gòu)與行為分離;

  2. 多給綁定事件使用命名空間;

    function init(){};
    $('.box').on('click', init);//1.重用高
    $('.box').on('click.cinit', init); //3.用.來區(qū)分


暫時(shí)這么多,后面再慢慢完善和補(bǔ)充

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容