1、 亂用選擇器

JQuery選擇器調用代價很大，反復調用效率更低。應采用緩存對象的方法或采用鏈式調用的方式。

//錯誤的寫法$("#button").click(function(){ ? ?$('#list li').addClass('strong'); ? ?$('#list li').css('color','red');});//正確的寫法$("#button").click(function(){ ? ?$lis = $('#list li'); ? ?$lis.addClass('strong'); ? ?$lis.css('color','red');});//更好的寫法$("#button").click(function(){ ? ?$('#list li').addClass('strong').css('color','red');});

2、全局選擇效率低

盡量使用上下文（context）查找，避免全局選擇的使用。全局選擇器會進行整個Doc的查找，效率很低。

//錯誤的寫法$(".active").method();//正確的寫法varul = $("#myList");$(".active",ul).method();

3 、復制匿名函數

避免多次復制匿名函數的寫法，將匿名函數分離出來，供其它對象多次調用。

//錯誤的寫法$('#myDiv').click(function(){//一些操作});//正確的寫法functiondivClickFn(){//一些操作}$('#myDiv').click( divClickFn );

4 、誤用ajax的complete

當用ajax進行數據請求時，避免使用complete回調方法，而應該使用success方法。complete回調在請求成功或失敗都會觸發。

//錯誤的寫法$.ajax({ ?url:"http://tools.42du.cn/jsonp/student/all",}).complete(function(data){//一些操作});//正確的寫法$.ajax({ ?url:"http://tools.42du.cn/jsonp/student/all",}).success(function(data){//一些操作});

5、 鏈式調用的誤用

采用鏈式調用的方式會使對象在漸變未完成之前就被移除，即remove方法會在fadeOut方法完成之前調用。當需要第一方法完成之后，再執行第二個方法，請使用回調，即第二種方式。

//錯誤的寫法$("#myDiv").click(function(e){ ?$(this).fadeOut("slow").remove();});//正確的寫法$("myDiv").click(function(e){ ?$(this).fadeOut("slow",function(){ ? ?$(this).remove(); ?});});

6 、事件多次綁定

如果你綁定（bind）同一事件多次，響應就會被執行多次。為避免多次執行，請先做事件解綁再重新綁定。

//避免響應多次執行$("myDiv").unbind("click").bind("click");

7、錯誤使用this指示符

this指示符存在于一定的上下文中的，當上下文變化時this指向不同的對象。如果還想調用原上下文中的this，則需要在原上下文中緩存原this對象（ $that = $(this) ）。

//錯誤的寫法$("#myList").click(function(){ ? $(this).method();? ? $("#myList li").each(function(){//this并不指向myList$(this).method2();? ? })});

歡迎關注我的公眾號（同步更新文章）：DoNet技術分享平臺

閱讀原文

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的JQuery七个常犯的错误的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。