介紹25種很實用的ES6方法,來解決實際開發中的問題


主要是介紹25種ES6方法,這些方法都挺實用的,用本本記好要考的,嘿嘿嘿。時不時翻出來看看

1.如何隱藏所有指定的元素


介紹25種很實用的ES6方法,來解決實際開發中的問題

2. 如何檢查元素是否具有指定的類

在頁面DOM裡的每個節點上都有一個classList對象,程序員可以使用裡面的方法新增、刪除、修改節點上的CSS類。使用classList,程序員還可以用它來判斷某個節點是否被賦予了某個CSS類

介紹25種很實用的ES6方法,來解決實際開發中的問題

3. 如何切換一個元素的類


介紹25種很實用的ES6方法,來解決實際開發中的問題

4. 如何獲取當前頁面的滾動位置


介紹25種很實用的ES6方法,來解決實際開發中的問題

5. 如何平滑滾動到頁面頂部


介紹25種很實用的ES6方法,來解決實際開發中的問題


requestAnimationFrame()不需要設置時間間隔,是由系統的時間間隔定義的。大多數瀏覽器的刷新頻率是60Hz(每秒鐘反覆繪製60次),循環間隔是1000/60,約等於16.7ms。大多數瀏覽器會對反覆揮著這個操作加以限制,不能超過60HZ,即使人為設置超過了該值,效果也不會改善。requestAnimationFrame()

保證了最佳的繪製效率。

當頁面被隱藏或者最小化時,setInterval()仍在後臺繼續執行,這種動畫刷新是完全沒有意義的,對cpu也是極大的浪費;

當頁面被隱藏或者最小化時,requestAnimationFramel()中頁面的渲染會被系統暫停,當頁面再次激活後,繼續從上次停止地方繼續繪製;

6. 如何檢查指定的元素在視口中是否可見


介紹25種很實用的ES6方法,來解決實際開發中的問題

7. 如何檢查父元素是否包含子元素


介紹25種很實用的ES6方法,來解決實際開發中的問題

8. 如何獲取元素中的所有圖像


介紹25種很實用的ES6方法,來解決實際開發中的問題

9. 如何確定設備是移動設備還是臺式機/筆記本電腦


介紹25種很實用的ES6方法,來解決實際開發中的問題

10. 獲取當前url


介紹25種很實用的ES6方法,來解決實際開發中的問題

11. 驗證url的格式合法性


介紹25種很實用的ES6方法,來解決實際開發中的問題

12. 如何創建一個包含當前URL參數的對象


介紹25種很實用的ES6方法,來解決實際開發中的問題

13. 如何將一組表單元素轉化為對象


介紹25種很實用的ES6方法,來解決實際開發中的問題

14. 如何從對象檢索給定選擇器指示的一組屬性


介紹25種很實用的ES6方法,來解決實際開發中的問題

15. 如何在等待指定時間後調用提供的函數


介紹25種很實用的ES6方法,來解決實際開發中的問題

16. 如何在給定元素上觸發特定事件且能選擇地傳遞自定義數據


介紹25種很實用的ES6方法,來解決實際開發中的問題


啟動文檔的時候因為"document.dispatchEvent(newEvent)"的關係,會先觸發一次事件:


介紹25種很實用的ES6方法,來解決實際開發中的問題

之後你每執行一次"document.dispatchEvent(newEvent)"都會觸發這個事件:


介紹25種很實用的ES6方法,來解決實際開發中的問題

接下來我們看看Event()這個方法的語法

<code>event = new Event(typeArg, eventInit);/<code>


介紹25種很實用的ES6方法,來解決實際開發中的問題

下面將展示使用detail參數的例子,使用到detail的部分我會加粗處理(為了看著方便,這回就不傳遞EventInit字典中的參數了):


介紹25種很實用的ES6方法,來解決實際開發中的問題

17. 如何從元素中移除事件監聽器


介紹25種很實用的ES6方法,來解決實際開發中的問題

18. 如何獲得給定毫秒數的可讀格式


介紹25種很實用的ES6方法,來解決實際開發中的問題

19. 如何獲得兩個日期之間的差異(以天為單位)


介紹25種很實用的ES6方法,來解決實際開發中的問題

20. 如何向傳遞的URL發出GET請求


介紹25種很實用的ES6方法,來解決實際開發中的問題

21. 如何對傳遞的URL發出POST請求


介紹25種很實用的ES6方法,來解決實際開發中的問題

22. 如何為指定選擇器創建具有指定範圍,步長和持續時間的計數器


介紹25種很實用的ES6方法,來解決實際開發中的問題

23. 如何將字符串複製到剪貼板


介紹25種很實用的ES6方法,來解決實際開發中的問題

24. 如何確定頁面的瀏覽器選項卡是否聚焦

介紹25種很實用的ES6方法,來解決實際開發中的問題

25. 如何創建目錄(如果不存在)


介紹25種很實用的ES6方法,來解決實際開發中的問題

這裡面的方法大都挺實用,可以解決很多開發過程問題,大家就好好利用起來吧。


分享到:


相關文章: