jQ鏈式寫法詳解

2022-08-15 03:03:21 字數 1068 閱讀 4733

jq的鏈式寫法很好用,直接打【.】就可以了,說起來jq 是如何實現鏈式寫法的呢?

很多人都說jq的鏈式寫法就是return this   那麼return this代表了什麼呢?

簡單說return this就是要返回下乙個函式的執行父級(原諒我語文不好,找不到乙個更好的詞代替父級這倆個字。)

那麼下面寫個例子,來實現乙個簡單的鏈式寫法:

1

function

a()6

function

b()11 a().b();

這算實現了鏈式寫法吧? 我返回下乙個函式的父級,當a函式執行完後,返回window,這樣下個b函式也可以進行操作,當然這個在專案中不這麼寫。

在寫個專案中可以使用的鏈式寫法:

1

function

a()5

function

b()9

var obj=

13 obj.a().b();

那麼jq是如何實現鏈式寫法的呢?肯定不是這麼簡單對吧?

介紹下jq是如何實現鏈式寫法的。

在jq中有這麼一行**定義了

1 jquery = function

(selector, context) ,

jquery.fn = jquery.prototype = {}
jquery.fn.init.prototype = jquery.fn;

簡單說這幾行**實現了jq的鏈式寫法定義乙個函式,return 乙個例項,init函式裡進行了處理初始化操作,比如選擇器,拼接字串等等,這裡不一一介紹。

最後再將jq的prototype 賦值給init方法的prototype。

這樣就實現了鏈式寫法。在工作中也經常會使用到jq的鏈式寫法,比如說:

在做移動端專案的時候,通常大家會引入zepto。但是zepto大約27k左右,在移動端已經很大了,那麼我們就有必要不去引入zepto。而是我們單獨寫乙個常用方法庫。

並且使用鏈式寫法,操作簡單,而且還是專門應對於我們的專案。所以推薦大家不引入zepto。而是自己去寫個常用方法庫。

JQ鏈式呼叫

1.鏈式呼叫 形式 box css width 200px css height 200px css background color green 2.對屬性進行操作可以使用json形式 box css 3.事件中的this指向 jquery中提供了乙個方法,可以將js物件轉換為jquery物件 語...

jq 外掛程式寫法

1.一次宣告乙個函式 fn.函式名 function options fn.red function options var settings extend defaults,options this.css settings return this 2.一次宣告多個函式 fn.extend fn....

jq的外掛程式的寫法

兩種方式 方法一 extend extend src 將src合併到全域性物件中去 使用方式 var i add 3,2 方法二 fn.extend jquery.fn jquery.prototype 也就是jquery物件的原型 fn.extend src 方法將src合併到jquery的例項物...