در قسمت Inspect مرورگر و بخش Console با استفاده از دستو history می­توان به تاریخچه stateها (یا صفحات طی شده توسط کاربر) دسترسی داشت. هر کدام از این صفحات به صورت length در history ذخیره می­شوند. در واقع ویژگی history.length یک ویژگی فقط خواندنی است که یک عدد صحیح را برمی‌گرداند که نشان‌دهنده تعداد المان­ها در history بوده، از جمله شامل صفحه بارگذاری‌شده فعلی نیز است.

برای عقب یا جلو رفتن در صفحه می­توان از ویژگی­های history.forward() یا history.back() و یا history.go() استفاده کنید. مقدار ورودی برای دو مورد اول عدد صحیح مثبت است، برای مثال history.back(2) یعنی دو state یا صفحه به عقب برگرد؛ و مقدار ورودی برای مورد سوم اعداد صحیح مثبت و منفی به ترتیب برای forward و back است؛ برای مثال history.go(-2) یعنی دو state یا صفحه به عقب برگرد.

ویژگی history.state مقداری را برمی‌گرداند که نشان‌دهنده state بالای history stack است. در حالت اولیه مقدار state برابر null است، اما می­توان از طریق popstate یا کدهای JavaScript به آن مقدار داد. این مقداردهی می­تواند object یا ... باشد که در صورت نیاز بتوان در برنامه از آن استفاده کرد. مقدار نسبت داده شده به state باید قابلیت Serialization داشته باشد.

ویژگی pushState(state, unused, url) دارای سه مقدار است؛ به ترتیب:

·       state: یک object از JavaScript است که به وسیله آن می­توان یک state جدید را ساخت. در این حالت length تغییر کرده و state نیز از حالت null درآمده و مقداردهی می­شود.

·       unused: پارامتر دوم و درحال حاضر بلااستفاده است، پیشنهاد می­شود به جای آن یک string خالی بگذارید.

·       url: پارامتر سوم و optional است. مقدار نسبت داده شده به آن، مقداری را به url اضافه می­کند. با این کار صفحه refresh نشده و فقط آدرس url تغییر می­کند.

با تغییر در صفحه یا back و یا forward در ان، یک event با نام popstate رخ می­دهد. برای فراخوانی آن می­توان به این صورت عمل کرد:

window.addEventListener('popstate', (event)=>console.log(event))

که فقط درصورتی عمل log رخ می­دهد که در صفحه به عقب یا جلو بروید. نتیجه: