《鋒利的jQuery》學習筆記

ConardLi 發布于2019-08-19 14:42 / 835人閱讀

摘要：同同事件命名空間取消事件不同于不會獲得焦點同因此可用變量讓下拉框選中為值添加，會覆蓋刪除元素切換切換顯示隱藏判斷元素是否存在同同同也可直接移動元素同同同但其實綁定的是事件，因此觸發離開事件是插件方法可寫在或直接，注意其中的為對象，而不是對象

if($(div).is(".class"))同 if($(div).hasClass("class"))

$(div).height($(div).height()+50) 同$(div).animate({height:"+=50"},400)

事件命名空間 $(div).bind("click.namespace"),取消事件$(div).unbind(".namespace")

$(div).triggerHandler("focus")不同于$(div).trigger("focus"),不會獲得焦點

$(div).addClass("test")同$(div)["addClass"]("test"),因此可用變量$(div)[hasclass?"removeClass":"addClass"]("test")

讓下拉框選中$(select).val(["text1","text2"])text1為option值

addClass("class")添加class，attr("class",class)會覆蓋class

刪除元素$(li).remove() $(li:eq(2)).detach()

toggleClass()切換class,toggle()切換顯示隱藏

判斷元素是否存在if($(div).length > 0 )

$(".one + div") 同$(".one").next("div"),$(".one ~ div") 同$(".one").nextAll("div")

$(div).click(functioin(){ if($(this).is(":visible")) { $(this).next().hide(); } else{ $(this).next().show(); } });同$(div).toggle(function(){ $(this).next().hide(); }, function(){$(this).next().show();} );也可直接 $(div).click(functioin(){$(this).next().toggle();});

移動元素$(li).appendTo($ul)

slideToggle同slideUp,slideDown,fadeToggle同fadeIn,fadeOut

hover同mouseover,mouseout但其實綁定的是mouseenter,mouseleave事件，因此觸發離開事件是trigger("mouseleave")

jquery插件方法可寫在$.fn.extend({test:function(){}}) 或直接$.extend({test:function(){}})，注意其中的this為jq對象，而不是dom對象

$(form).searlize()將form對象序列化為字符串$(form).searlizeArray()轉化為json對象$.param({name:"sf",age:1})轉化為name=sf&age=1

延遲觸發delay(1000)

var str=$("p").map(function(){
return $(this).text()
}).get().join(",") 返回p標簽所有的內容

$(:input) .attr("checked") 返回undefined
$(:input) .prop("checked")返回true false
$(:input) .prop("checked",true)
$(:input) .removeProp("checked")取消選中

第一次寫博客，有錯誤請指出，輕拍

GPU云服務器云服務器鋒利的jquery jquery學習筆記學習筆記學習筆記一

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/78071.html

鋒利的jQuery學習心得

摘要：熟悉了插件的組織結構以及比較統一的修改和學習方法。項目結束后，抽時間專門學習的進一步知識。對于選擇器的性能，自己在看到了類似問題無人回答，好奇之下自己測試了與的速度，并被網友指出使用不當。智營銷項目中開始嘗試使用jQuery并獲得了很大的幫助，項目結束之后專門花時間認真看本書，配合網上搜索的一些知識和源碼，收獲很大。首先就是在項目中實戰邊學邊用了DOM的系列操作，并踩了JQ attr...

focusj 2019-08-20 10:49 評論0 收藏0
26天學通前端開發（配資料）

摘要：網上有很多前端的學習路徑文章，大多是知識點羅列為主或是資料的匯總，數據量讓新人望而卻步。天了解一個前端框架。也可以關注微信公眾號曉舟報告，發送獲取資料，就能收到下載密碼，網盤地址在最下方，獲取教程和案例的資料。前言好的學習方法可以事半功倍，好的學習路徑可以指明前進方向。這篇文章不僅要寫學習路徑，還要寫學習方法，還要發資料，干貨滿滿，準備接招。網上有很多前端的學習路徑文章，大多是知...

blair 2019-08-21 16:59 評論0 收藏0
2017-08-28 前端日報

摘要：前端日報精選譯高階函數利用和來編寫更易維護的代碼，從入門到放棄響應式編程入門行的電梯調度模擬器個人分享前端學習資源分享中文周刊技術周刊期知乎專欄中的內置方法知乎專欄中的柯里化前端大寶劍小結常見知識依賴收集掘金項目主域重 2017-08-28 前端日報精選【譯】高階函數：利用Filter、Map和Reduce來編寫更易維護的代碼Webpack 3，從入門到放棄響應式編程入門：50 行...

xumenger 2019-08-20 18:59 評論0 收藏0
前端相關大雜燴

摘要：希望幫助更多的前端愛好者學習。前端開發者指南作者科迪林黎，由前端大師傾情贊助。翻譯最佳實踐譯者張捷滬江前端開發工程師當你問起有關與時，老司機們首先就會告訴你其實是個沒有網絡請求功能的庫。前端基礎面試題(JS部分) 前端基礎面試題(JS部分) 學習 React.js 比你想象的要簡單原文地址：Learning React.js is easier than you think 原文作...

fuyi501 2019-08-22 13:46 評論0 收藏0
你需要的前端進階書籍清單，分享下載

摘要：寫在前面目前專注深入學習，特花了點時間整理了一些前端學習相關的書籍。大致分為以下大系列系列系列基礎系列應用系列進階系列類庫系列框架系列。這些書籍在這里免費提供下載，有興趣的一起學習。寫在前面目前專注深入JavaScript學習，特花了點時間整理了一些前端學習相關的書籍。大致分為以下7大系列：CSS系列、DOM系列、JavaScript基礎系列、JavaScript應用系列、Ja...

yuanzhanghu 2019-08-26 10:28 評論0 收藏0