window.scroll 方法只能存在一次該如何解決？

頁面監聽是我們經常使用的一個功能，下面兩段代碼表示兩個事件，分別在頁面滾動 500px 和 1000px 時觸發，在代碼中使用了箭頭函數。

window.addEventListener('scroll', () => {
   var scrollTop = document.documentElement.scrollTop 
   if (scrollTop > 500) {
       console.log('滾動了500px')
   }
})

window.addEventListener('scroll', () => {
   var scrollTop = document.documentElement.scrollTop 
   if (scrollTop > 1000) {
        console.log('滾動了1000px')
   }
})

但是後面又要求代碼兼容到 IE10，就不能採用這種寫法了。然後我就想使用原生的function寫法。

window.onscroll = function() {
    // ...
}

在使用的過程中我發現，如果只有一個window.scroll沒有任何問題，但是如果有多個window.scroll，後面的就不會生效。

那麼如何解決這個問題呢？

window.scroll只能存在一次，第一個會生效，後面的不生效，可以通過 js 處理這個問題。

function addEvent(type, toDo) {
    if (window.attachEvent) {
        window.attachEvent('on' + type, function() {
            toDo.call(window)
        })
    } else {
        window.addEventListener(type, toDo, false)
    }
}

addEvent('scroll', function(){
    console.log('第一次調用window.scroll')
}

addEvent('scroll', function(){
    console.log('第一次調用window.scroll')
}

運行一下，多個scroll可以同時運行。