下面是一個簡單的示例，展示如何使用pushState，popState和location.hash來實現一個簡單的小型路由：
var routes = {};
function route(path, callback) {
routes[path] = callback;
}
function handleRoute() {
var path = location.hash.slice(1);
if (routes[path]) {
routes[path]();
}
}
function navigateTo(path) {
history.pushState(null, null, '#' + path);
handleRoute();
}
window.addEventListener('popstate', handleRoute);
// 示例路由
route('/', function() {
console.log('Home page');
});
route('/about', function() {
console.log('About page');
});
// 處理初始路由
handleRoute();
在上面的代碼中，我們首先定義了一個routes對象，用來存儲不同路徑對應的回調函數。然后定義了一個route函數，用來注冊路徑和對應的回調函數。
在handleRoute函數中，我們從location.hash中獲取當前路徑，并檢查是否存在對應的回調函數。如果存在，就執行對應的回調函數。
navigateTo函數用于導航到指定路徑。它會使用history.pushState方法來修改URL路徑，然后再調用handleRoute函數來執行對應的回調函數。
最后，我們通過監聽popstate事件來處理瀏覽器的前進后退操作，當用戶點擊瀏覽器的前進或后退按鈕時，會觸發popstate事件，我們可以在事件處理函數中重新執行對應的回調函數。
在示例路由中，我們注冊了兩個路徑：'/'對應首頁，'/about'對應關于頁面。你可以根據自己的需求注冊更多的路徑和回調函數。
