History 对象是 Browser Object Model(BOM)的一部分,提供了浏览器窗口的历史记录的信息和操作。你可以通过 window.history 访问到这个对象。History 对象的一些常见属性和方法包括:

属性:

1. history.length: 返回历史记录中的页面数量。
    var historyLength = window.history.length;
    console.log('History Length: ' + historyLength);

方法:

1. history.back() 和 history.forward(): 分别用于在历史记录中后退和前进一步。
    // 后退一步
    window.history.back();

    // 前进一步
    window.history.forward();

2. history.go(): 跳转到历史记录中的指定页面。参数可以是一个整数,表示前进或后退的步数,也可以是一个字符串,表示要跳转的具体页面的 URL。
    // 后退两步
    window.history.go(-2);

    // 前进三步
    window.history.go(3);

    // 跳转到具体的页面
    window.history.go('https://www.example.com');

3. history.pushState() 和 history.replaceState(): 用于在浏览器历史记录中添加或修改一条记录,但不会触发页面的重新加载。
    // 添加一条历史记录,不会触发页面重新加载
    window.history.pushState({ page: 1 }, 'Title', '/page1');

    // 修改当前历史记录,同样不会触发页面重新加载
    window.history.replaceState({ page: 2 }, 'New Title', '/page2');

这些方法可以帮助你在浏览器历史记录中进行导航,并在不触发页面重新加载的情况下修改 URL。需要注意的是,对 history.pushState() 和 history.replaceState() 的调用不会引起页面的实际导航,因此通常需要结合事件监听器和其他逻辑来实现更复杂的导航和状态管理。


转载请注明出处:http://www.pingtaimeng.com/article/detail/6192/JavaScript 和 HTML DOM