雜七雜八

 var head = document.getElementsByTagName('head')[0] || document.body; function loadJsModule(url) { var script = document.createElement('script'); script.charset = 'utf-8'; script.type = 'text/javascript'; script.onload = script.onreadystatechange = function() { if (!this.readyState || this.readyState === 'loaded' || this.readyState === 'complete') { /* * 加載邏輯, callback爲define的回調函數, args爲全部依賴模塊的數組 * callback.apply(window, args); */ script.onload = script.onreadystatechange = null; } }; }

史上最全面、最透徹的BFC原理剖析

移動 Web 開發問題和優化小結

JS對象的深淺複製

BetterScroll：多是目前最好用的移動端滾動插件

vue移動助手實踐【5】

聊聊Vue.js的template編譯

爲何 call 比 apply 快？

setTimeout(fn, 0) 的做用

發佈-訂閱模式

互聯網大廠求職面經及總結

js的事件循環

25 個最基本的 JavaScript 面試問題及答案

前端常見跨域解決方案（全）

Websocket

JS 的正則表達式

CSS 僞類選擇器

vh,vw單位你知道多少？【掃盲】

Event Loop

前端性能優化之加載技術【5星級】

JavaScript Event Loop 機制詳解與Vue.js 中 nextTick 【乾貨】

CSS技巧：逐幀動畫抖動解決方案

理解構造函數與原型對象

設計模式系列課程-委託模式實戰微博發佈功能

Javascript 黑科技【4星級】

從性能的角度看CSS選擇器

【整理】CSS佈局方案

getElementsByClassName與classList兼容性問題與解決方案

Ajax知識體系大梳理

Fetch進階指南

Promise使用手冊

你不知道的CSS 【乾貨】

CSS實現長寬比的幾種方案

高性能滾動 scroll 及頁面渲染優化，函數節流【乾貨】

JS面試高級技巧【乾貨】

你不知道的JS 【掃盲】

你不知道的CSS（二）

浮動兩端對齊【掃盲】

面試必備之JS繼承方式總結【乾貨】

整理下《前端江湖面試》對本身有益的題目。

阿里校招前端面經【乾貨】

從新認識JS的this

H5拖放和WebWorker 【掃盲】

史上前端面試最全知識點（附答案）【乾貨】

JSONP原理及簡單實現【掃盲】

移動端Click點擊300毫秒延遲及其解決辦法

zepto的tap點透問題

JS開發中的一些小技巧和方法

週末讀fastclick.js源碼有感在touchend合成一個事件當即觸發解決300ms問題

fastclick是將事件綁定到你傳的元素（通常是document.body） ② 在touchstart和touchend後（會手動獲取當前點擊el），若是是類click事件便手動觸發了dom元素的click事件 因此click事件在touchend便被觸發，整個響應速度就起來了，觸發實際與zepto tap同樣 既然瀏覽器有這300ms的延遲，那麼咱們來代替瀏覽器判斷，手動觸發click事件，這也是fastClick的解決方案。 // 自定義事件 var eve = new Event('自定義事件名'); el.addEventListener('自定義事件名', function(){ console.log('自定義事件') }); el.dispatchEvent(eve); // fastClick的核心代碼 FastClick.prototype.onTouchEnd = function(event){ // 一些狀態監測代碼 // 從這裏開始， if (!this.needsClick(targetElement)) { // 若是這不是一個須要使用原生click的元素，則屏蔽原生事件，避免觸發兩次click event.preventDefault(); // 觸發一次模擬的click this.sendClick(targetElement, event); } } 這裏能夠看到，FastClick在touchEnd的時候，在符合條件的狀況下，主動觸發了click事件，這樣避免了瀏覽器默認的300毫秒等待判斷。爲了防止原生的click被觸發，這裏還經過event.preventDefault()屏蔽了原生的click事件。 咱們來看看他是怎麼模擬click事件的 FastClick.prototype.sendClick = function(targetElement, event) { // 這裏是一些狀態檢查邏輯 // 建立一個鼠標事件 clickEvent = document.createEvent('MouseEvents'); // 初始化鼠標事件爲click事件 clickEvent.initMouseEvent(this.determineEventType(targetElement), true, true, window, 1, touch.screenX, touch.screenY, touch.clientX, touch.clientY, false, false, false, false, 0, null); // fastclick的內部變量，用來識別click事件是原生仍是模擬 clickEvent.forwardedTouchEvent = true; // 在目標元素上觸發該鼠標事件， targetElement.dispatchEvent(clickEvent); 咱們在網上搜索fastClick，大部分都在說他解決了zepto的點擊穿透問題，他是怎麼解決的呢？就是上面最後一句，他模擬的click事件是在touchEnd獲取的真實元素上觸發的，而不是經過座標計算出來的元素。