原创 箭頭函數的this指向
1.普通函數的this：指向它的調用者，如果沒有調用者則默認指向window.2.箭頭函數的this: 指向箭頭函數定義時所處的對象，而不是箭頭函數使用時所在的對象，默認使用父級的this.圖1：函數fn的父級this指向window圖2
2019-02-22 22:54:15
原创 CSS過渡和動畫
一.過渡1.定義：將CSS的屬性值在一段時間內平緩變化的過程給體現出來；2.指定過渡屬性 2.1作用：指定哪個或者哪幾個屬性值，在變化時需要使用過渡效果來體現；2.2屬性：transition-property取值：屬性名 例子：tran
2019-02-22 22:54:15
原创 函數節流和防抖
一、函數節流 （1）定義：一個函數執行一次後，只有大於設定的執行週期後纔會執行第二次 （2）原理：用時間戳來判斷是否已到回調該執行時間，記錄上次執行的時間戳，然後每次觸發 scroll 事件執行回調，回調中判斷當前時間戳距離上次執行時間
2019-02-22 22:54:14
原创 Vue自定義指令
除了核心功能默認內置的指令 (v-model 和 v-show等)，Vue 也允許註冊自定義指令。 1.例子一：<!DOCTYPE html><html><head lang="en"><meta charset="UTF-8"><titl
2019-02-22 22:54:14
1
原创 瀏覽器的渲染知識（一）
先從兩段代碼說起：（1）<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>test</title> </head><body><ul id="container"></ul>
2019-02-22 22:54:13
原创 箭頭函數的this指向
1.普通函數的this：指向它的調用者，如果沒有調用者則默認指向window.2.箭頭函數的this: 指向箭頭函數定義時所處的對象，而不是箭頭函數使用時所在的對象，默認使用父級的this.圖1：函數fn的父級this指向window圖2
2018-12-07 13:13:50
原创 函數節流和防抖
一、函數節流 （1）定義：一個函數執行一次後，只有大於設定的執行週期後纔會執行第二次 （2）原理：用時間戳來判斷是否已到回調該執行時間，記錄上次執行的時間戳，然後每次觸發 scroll 事件執行回調，回調中判斷當前時間戳距離上次執行時間
2018-12-06 12:54:18
原创 關於flex的三屬性2--flex-basis
1.先看幾個例子：（1）每個item均未設置width 和 flex-baiss,元素呈現的大小爲flex下內容的大小 （2）元素item01只設置width=100px(隱含flex-basis=auto),元素item02只設置
2018-11-04 02:46:52
原创 關於flex的三屬性（1）flex-grow
flex-grow 這篇先講flex取值的問題，後面的文章在深入講解彈性佈局的應用。1.flex是由 flex-grow，flex-shrink，flex-basis組成。看下圖其中flex-grow:代表父容器在主軸上還有多少剩餘空
2018-11-03 02:49:51
原创 Vue生命週期鉤子函數
<!DOCTYPE html><html lang="en"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-s
2018-09-11 09:23:51
原创 CSS3之轉換
一、轉換 1.定義：改變元素在頁面的形狀、角度、大小、位置的一種效果。 2.分類：2D轉換和3D轉換。 2D轉換： (1)位移 1-1 作用：改變元素在頁面中的位置； 1-2 語法：屬性--tr
2018-09-11 09:23:51
原创 Vue組件間的通信--父傳子
屬性傳值，子組件props 接收<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title></title></head><body><div id="app"> <parent
2018-09-11 09:23:51
原创 CSS複雜選擇器
CSS 復 雜 選 擇 器對CSS複雜選擇器做一個簡單的總結：1-2 相鄰兄弟選擇器、通用兄弟選擇器 <style> p+b{ font-size:30pt;
2018-09-11 09:23:51
原创 Vue自定義指令
除了核心功能默認內置的指令 (v-model 和 v-show等)，Vue 也允許註冊自定義指令。 1.例子一：<!DOCTYPE html><html><head lang="en"><meta charset="UTF-8"><titl
2018-09-11 09:23:50
2