ES6是Javascript的新標準,它提供了更多的語言特性和簡化的語法,使得編寫Javascript代碼更加容易。同時,Jquery是一款著名的Javascript庫,它提供了許多強大的函數和方法,可以幫助我們更加方便地操作DOM,處理事件等等。在ES6和Jquery的結合下,我們可以輕松地編寫出高效可靠的Jquery插件。
class Modal{ constructor(element){ this.$element = $(element); this.$overlay = $(""); this.$modal = $(""); this.$close = $(""); this.$content = $(""); this.$modal.append(this.$close,this.$content); this.$overlay.append(this.$modal); $("body").append(this.$overlay); this.$close.click(() =>{ this.hide(); }); } show(){ this.$overlay.show(); } hide(){ this.$overlay.hide(); } } $.fn.modal = function(){ return this.each(function(){ new Modal(this); }); };
這個例子展示了如何使用ES6的class語法來定義一個Modal類,并將其作為一個Jquery插件,直接附加到Jquery的實例上。這個插件可以在頁面中輕松創建彈窗,當用戶點擊關閉按鈕時自動隱藏。