鍵盤事件最基本的應用場合是控制文字框元素，而我們要討論的，就是幾個鍵盤事件：keydown、keypress、keyup、textinput發生的時機與文字輸入的過程的關係。先看一段**：
keydown->keypress->textinput->keyup，如果按照不放就交替執行keydown和keypress；另一種是按下非字元鍵，chrome下執行順序為keydown->keyup，如果按著不放就不停地執行keydown。
事件的順序搞清楚了，但我們還要看清鍵盤事件發生與文字框變化的順序。把上面**中的每個事件處理程式再加一句console.log(input.value)，按乙個字元。可以看到，除了keyup外，keydown、keypress、textinput事件並不會輸出剛按下的字元，說明他們在文字框變化之前發生而keyup在之後發生。進一步地，也可以給每個事件加個alert()看看，雖然由於alert()的干擾導致keyup不發生（單步除錯得出的結論），但這樣一步步執行也能直**出上面的結論。
最後要注意，雖然各瀏覽器基本遵循上面的事件執行順序，但不同瀏覽器對鍵盤事件的實現仍有差別，比如火狐和ie並不支援textinput事件；而同時對於非字元鍵，也不一定就按上面提到的只響應keydown和keyup，比如在火狐下按backspace鍵也具有字元鍵的行為。
資料互動的可靠與安全是前端工程需要考慮的重要一環，我們的使用者既可能輸入一段有歧義的字元，也隨時可能給你來段sql注入或xss，這裡我也遇到乙個簡單點的情景：如何拿使用者輸入的內容來構建有效的正則進行查詢。
考慮到使用者可能會輸入一些正則的專用符號，如果不對這些符號進行轉義就直接把整個字串拿去構造正則，那勢必會使查詢結果背離我們的本意。正規表示式裡對特殊符號轉義只要在前面加\，所以思路就是將源字串中的特殊符號替換為\待轉義字元。實現如下：
function transfer(string)replace方法，第乙個引數乙個是全域性匹配所有待轉義字元的正則；第二個引數是個$表示式，$&獲取所有與正則相匹配的子串，注意這裡要在其前面加上\\而非\，因為在普通字串裡使用\也得寫為\\進行轉義。
可能有人會問，$&不是相當於regexp.lastmatch匹配最近一次匹配項嗎，為何使用它獲取全域性正則的所有匹配項？
可以這麼想，replace對全域性正則匹配項的替換是逐個進行的，每匹配乙個子串就用第二個引數的規則替換一次。所以用$&每次替換最近一次匹配項，也就能到達看起來一次替換了全域性正則的所有匹配項效果。
前端碎語（6）
在頁面裡，螢幕上游標的樣式我們可以用css的 cursor 屬性進行定義。一般來講，只要游標hover到指定的元素上面其樣式就會按我們指定的進行顯示，但是如果我們指定的元素被其他元素 遮住了 呢？來看看下面這個demo demo 可以看到，雖然我們給div1自定義了游標樣式，但在被div2蓋住的那部...
快取碎語二
快取很多條資料，但只讀取其中的一部分資料，如何處理？比如在快取中儲存了100條資料，但讀取分頁資料，比如每次分頁只讀取10條資料。這種情況下，可以把這100條資料拆分成10次分別儲存起來。每乙個快取項的key需要特別的設計，比如 01 10 products,02 10 products.如何避免快...
碎語，安魂詞。。。 偷懶
早上12起床 輕聲嘆 起早了 摸了點吃了 沙發裡漫無目的換著臺 晚上 心空laolao的 發誓 再也不過這樣的週末了 後來又到週末了 沙發依然 吃一塊冰糖 呀！真甜 渴了，喝半舀子京巴涼水 啊！真過癮 早上6點起來 7點到了車站 9點才搭上車 靠，怎麼才來啊 花都謝了 發一條簡訊 隔半分鐘看看 隔半...