前沿
1. 文章收錄自己在開發過程中,學習到的jquery的知識,將從以下三個方向總結;
2. 文章的總結學習將從2019.11.19日正式開始,每週至少寫5篇內容;
3. 一年的時間,專注於javascript和jquery的學習,讓自己精通js和jq;
4. 該目錄收錄的所有文章,參考借鑑整理他人優秀的知識,自己所寫文章會標註參考文獻
5. 一些重要的知識點,自己會實踐開發,通過實例詳細的介紹某個方法、知識點或jquery ui等知識的使用。
6. 所寫的知識,作爲一種筆記方式,成爲自己的開發字典,使用時可以用來查找,開發過程中也會不斷完善某個知識點,以及整個開發目錄。
一、方法
(1)extend({},item1,item2,……)
(2)https://www.cnblogs.com/luyuan/p/3940116.html
2. $(selector).each(function(index,element))和$.each(dataresource,function(index,element))
看源碼一切就明白了:$.each()方法,callback回調函數,調用的是obj
/**
* jQuery上拓展的靜態方法,遍歷對象或數據
* @param {*} obj
* @param {*} callback
*/
each: function(obj, callback) {
var length, i = 0;
if (isArrayLike(obj)) {
length = obj.length;
for (; i < length; i++) {
if (callback.call(obj[i], i, obj[i]) === false) {
break;
}
}
} else {
for (i in obj) {
if (callback.call(obj[i], i, obj[i]) === false) {
break;
}
}
}
return obj;
},
再來看看$(selector).each()
/**
* 實例方法,this指向調用者本身
* @param {*} callback
*/
each: function(callback) {
return jQuery.each(this, callback);
},
4.resize() 方法
5.animate() 方法
8. jquery的$.type()方法和javascript的toString 方法以及Object.prototype.toString.call()
9. ES5的數組新方法forEach、filter、map、every、some;indexOf和lastIndexOf
10. 數組方法:push、pop、unshift、shift、splice、sort;改變原數組的方法
11. 數組方法:concat、slice、reverse;只複製出副本,不改變原數組;
13. jquery給標籤添加屬性或獲取屬性值attr方法,移除屬性removeAttr方法、
15. jquery的trigger和triggerHandler方法
16. jquery中的data的使用,data方法綁定的屬性在哪裏存着
17. 事件綁定的類型,具體區別,live、on、$(document).on(''),綁定事件的類型,新插入的html也會被綁定事件。
18. show和hide方法的權重,與行間樣式相比,他們的權重如何?
19. $()[0],jquery類數組中的某一個是dom對象,不是jquery對象
20. 背景圖片的設置:backgrou-image,url()
21. 雜項index方法
22. closest方法,事件委託
23. 屬性特性的獲取和賦值
24. delegate
(1)delegate() 方法爲指定的元素(屬於被選元素的子元素)添加一個或多個事件處理程序,並規定當這些事件發生時運行的函數。
使用 delegate() 方法的事件處理程序適用於當前或未來的元素
(2)on() 方法在被選元素及子元素上添加一個或多個事件處理程序。
自 jQuery 版本 1.7 起,on() 方法是 bind()、live() 和 delegate() 方法的新的替代品。該方法給 API 帶來很多便利,我們推薦使用該方法,它簡化了 jQuery 代碼庫。
注意:使用 on() 方法添加的事件處理程序適用於當前及未來的元素(比如由腳本創建的新元素)。
提示:如需移除事件處理程序,請使用 off() 方法。
提示:如需添加只運行一次的事件然後移除,請使用 one() 方法。
25. $.fn.tabs=function、$.fn.extend({})
26. $(window).resize
27. ajax請求後的回調函數的作用域
28. jquery的靜態方法和實例方法
https://www.jb51.net/article/85773.htm
二、知識
三、jquery-ui
3. jquery chosen插件使用及select常用方法
(1)chosen設置寬度width:select標籤css中設置的width值會作用到對應的chosen生成的div標籤的元素上,所以:
修改select標籤的width值,即可修改chosen對應的div標籤的width值
比如:
(2)select內容居中、居左、居右等位置的變化由chosen生成的a標籤的padding決定的
可以通過在css樣式設置a標籤的padding值來修改select內容的位置
比如:
(3)設置顯示個數後的出現chosen滾動條
與設置css樣式一樣,chosen生成的div,設置height和overflow-y:auto,超出部分滾動條展示
比如:設置高度是100px,縱向超出部分出現滾動條
效果:
5.jQuery 自定義網頁滾動條樣式插件 mCustomScrollbar
可排序(Sortable)插件讓被選元素通過鼠標拖拽進行排序