需求：d1拖拽前新增字型 d2拖動時顏色變換 d3抬起時彈出對話方塊
繼承：可以實現，不過要在各自的原型上加上自己的業務邏輯，關鍵是不能互用，而且每乙個div都要寫一套**
元件化：把這些功能的函式名寫在建構函式的原型中，如果這個div要實現這個功能，就傳入對應的引數實現功能，關鍵點在於傳不同引數實現不同功能，基於同個**
1.元件化一般傳入的是物件，所以把引數傳在init方法，所以把獲取元素也放在init中，將全域性的this.odiv 設定為null。
2.這時我們在d1的init方法中，傳入方法屬性，就是我們的業務**，這時候init的引數是乙個物件，可以設定為options，獲取id可以用options.id獲取。但是時候我們傳入的方法，原型中還沒有呼叫。所以我們要在指定的地方呼叫這個函式。但是因為這個方法是init的區域性變數，在別的函式內讀不到，所以要在全域性中建立乙個變數this.settings,裡面就是放著init方法傳入的內容，這時候傳入的內容就變成全域性變數了，在別的函式內使用this.settings物件就能使用裡面的方法，但是這時候this.settings裡面還沒有東西。所以我們要建立乙個extend函式，在init方法裡面呼叫，將option裡面的內容拷貝到this.settings中去。這時候每個函式都可以獲取到傳入的引數了。
3.但是我們會發現，這時候如果d2，d3沒傳入相同的引數方法，會報錯，這是因為原型中呼叫了方法，但是我們沒傳，這時候肯定報錯，所以我們要在全域性this.settings中，設定每個方法為空函式。這時候的原理就是：每個例項都有這個方法，但是裡面都是空的，如果我們傳入乙個有業務邏輯的就會替代原來的，這樣子就實現了自己獨有的功能。
拖拽的繼承寫法
通過物件導向的方法，我們可以簡單建立無數個具有相同功能的div。但是我們如果像讓其中乙個有自己的功能，這就實現不了了。因為要修改原型中的方法，全部都有受影響。所以我們要採用乙個子類的建構函式，讓有了父類的基礎功能上，再加上自己的獨有的功能。1.建立乙個子類的建構函式，使用call方法繼承父級的靜態屬...
拖拽的物件導向寫法
上面是面向過程的寫法，而下面將講解如果寫物件導向的寫法，物件導向其實就是建立乙個建構函式，把執行函式寫到原型上面，然後可以通過建立例項物件的方法可以實現重複的呼叫。1.首先，建立出乙個建構函式，然後將出現的函式，從最裡面的執行函式依次寫到原型上，不可以出現函式巢狀，在最外層的函式裡面呼叫裡面的函式，...
前端元件化 可拖拽進度條元件
專案更迭建立前端ui元件庫的一些歸納總結。1.元件化開發解決的問題 2.元件化開發原則 3.例項 可拖拽進度條元件 可拖拽進度條元件引數 入參描述 min進度調左側對應最小值 max進度條右側對應最大值 value 當前值color 進度條顏色 rendersign 是否重繪進度條 slider c...