jQuery之多庫共存 外掛程式機制

2021-08-20 06:40:55 字數 940 閱讀 1244

背景

我們在呼叫jquery庫時,可能會呼叫不同的版本,這就會產生乙個問題——獲取物件問題,這就是多庫共存問題

解決方法——改名字

在jquery中,我們獲取dom物件時,使用的是$和jquery,程式預設的是兩種都可以呼叫物件,而且使用這兩種的版本是最新的版本,如果乙個舊版本想要獲取物件時則要分得其中一種方式,所以最新的版本需要放棄兩者中的乙個

獲取jquery版本編號:$.fn.jquery

放棄符號的使用權:$.noconflict()

用新的符號代替舊的符號,本質上還是用新的符號:

var sb=$.noconflict(true);

sb.fn.jquery 其獲取的版本還是舊版本

外掛程式引用步驟:

引包通過呼叫方法實現功能,引數不同,功能也不同

例一:懶載入

功能是只有你重新整理到頁面的固定位置,該位置下的內容才會載入,極大的省去了一些資源消耗

步驟是引入懶載入的包

呼叫方法:$(selector).lazyload();

例二:背景變色

在我們利用jquery作動畫時,我們只能改變透明度、長寬、顯示,無法改變背景顏色,此外掛程式就可解決這個問題

步驟:引包

呼叫:$(selector).css("backgroundcolor","red")此可以用於自定義動畫

自定義外掛程式(方法集)(js型別)

格式:$.fn.setcolor=function()

----繫結到原型

$.setcolor=function(e)

----繫結到$上

呼叫方式

jQuery 外掛程式機制

簡介 利用jquery提供的 fn.extend 和 extend 方法,擴充套件 extend 擴充套件jquery的類方法 作用 1.合併物件 var a var b 後面加到前面,屬性相同的後面覆蓋前面的屬性 console.log extend a,b 2.擴充套件jquery類方法 var...

jQuery外掛程式機制

為了擴充套件jquery庫函式,jquery提供了兩種方式 jquery.extend object 擴充套件jquery物件本身,主要是用來擴充套件jquery全域性函式 呼叫時直接 函式名 引數 如下例子 jquery.fn.extend object 擴充套件 jquery 元素集,主要用於擴...

JQuery外掛程式機制

jquery.extend object 擴充套件jquery物件本身,主要是用來擴充套件jquery全域性函式 呼叫時直接 函式名 引數 charset utf 8 title src js jquery 3.3.1.js script head var object 在object中定義方法mi...