從零開始寫乙個jquery日曆外掛程式(一)

2021-08-04 18:32:03 字數 1165 閱讀 1780

簡單來說,jquery外掛程式為擴充套件jquery原型物件的乙個方法。編寫jquery外掛程式其實就是給jquery原型新增乙個自定義的方法。我們先來看乙個最簡單的例子:$(「a」).attr(「href」,」這裡使用jquery選擇器,來查詢a元素,並返回乙個jquery物件。我們就可以通過這個物件來使用jquery中操作dom的內建方法。在此處,這裡呼叫的方法是jquery中內建的attr方法修改a標籤中的href屬性。其實,通過檢視juery原始碼,我們可以發現jquery.fn = jquery.prototype,也就是說,jquery.fn物件是jquery的原型物件,jquery的dom操作方法都在jquery.fn物件上定義的,然後jquery物件就可以通過原型繼承這些方法。

前面說了很多基本原理,但是其實要開發乙個功能簡單的jquery外掛程式並不難。雖然jquery外掛程式有各種各樣的寫法,但其都有乙個基本的結構,萬變不離其宗。

基礎jquery外掛程式框架

(function

($) )

})})

})(jquery);

下面,我們來看這乙個框架具體是什麼意思,以及為什麼要這樣寫。結構的最外層是個立即執行函式

//立即執行函式

(function

($))

(jquery)

;

這個立即執行函式的好處是,將所有外掛程式內所有的**都在匿名函式的區域性作用域中執行,不用擔心變數名與全域性作用域的**其衝突。並且函式外部無法訪問函式內部的公共變數和命名控制項,有一定的封裝性。

並且,這個立即執行函式將jquery物件作為引數傳入函式內部,這樣為我們就可以在函式內部使用jquery物件,給jquery物件新增自定義的方法了

//給jquery物件新增自定義的方法

$.fn.extend()

})})

注意,方法最後返回this.each(function{})即返回jquery物件,這樣該外掛程式就可以鏈式呼叫了。

至此,就query外掛程式的基本結構已經講完,下一節就正式開始日曆外掛程式的開發了。

這裡先放乙個最後的效果圖。

從零開始寫乙個Redis 1

為了學習redis和更好地理解redis,決定自己寫乙個c 版本的redis 2.redis協議解析 第一,我這裡僅僅只是學習redis的思想。所以使用的是c 而且很多資料結構使用stl。第二,我這裡不追求效能,所以不會極致地去考慮效能問題,而是以實現功能為主。對於看過redis原始碼的我來說,實際...

從零開始 寫乙個認證授權sdk

主題列表 juejin,github,smartblue,cyanosis,channing cyan,fancy,hydrogen,condensed night purple,greenwillow,v green,vue pro,healer readable,mk cute,jzman,ge...

怎麼從零開始寫乙個秒殺專案

一,環境搭建 技術選型,該秒殺專案是採用springboot2.0和springcloud來開發的 1首先搭建父專案,所有的模組都是依賴該父專案 2搭建服務註冊中心模組 eureka 3秒殺使用者模組 整合mybatis,web,thymeleaf等 相當於買家 4公共模組,對應的是資料庫表對應的實...