js判斷頁面是否第一次加載


原文    https://www.jb51.net/article/161965.htm

 

1 利用window.name屬性在頁面刷新時不會重置判斷(在該屬性空置的情況下可使用)

 

2 使用sessionStorage或cookie來判斷

與window.name實現方法類似在首次加載時設置一個固定值 之后判斷即可

這里以sessionStorage來為例

?
1
2
3
4
5
6
if (sessionStorage.getItem( "isReload" )){
    console.log( "頁面被刷新" );
} else {
  console.log( "首次被加載" );
  sessionStorage.setItem( "isReload" , true )
}

3 可以使用window.chrome對象 (該方法只在谷歌瀏覽器中可用 其他瀏覽器無chrome對象)

該對象提供了一個loadTimes() 方法 執行該方法我們會得到一個有關頁面性能的對象
其中有一個navigationType屬性可以幫助我們判斷頁面是加載還是刷新
它有兩個值 Reload(刷新) 和 Other(首次加載)

所以我們可以通過if判斷:

?
1
2
3
4
5
6
if (sessionStorage.getItem( "isReload" )){
    console.log( "頁面被刷新" );
} else {
  console.log( "首次被加載" );
  sessionStorage.setItem( "isReload" , true )
}

使用window.chrome.loadTimes方法會報警告

isreload.html:20 [Deprecation] chrome.loadTimes() is deprecated, instead use standardized API: Navigation Timing 2. https://www.chromestatus.com/features/5637885046816768.

官方已經說明該方法被棄用了 讓我們使用 標准化API: Navigation Timing 2
所有上面代碼需要改下:

?
1
2
3
4
5
if (window.performance.navigation.type == 1) {
  console.log( "頁面被刷新" )
} else {
  console.log( "首次被加載" )
}

總結


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM