JavaScript获取上一个页面的URL方法多，以下是一些常见的方法： 1. 使用`history`对象： ```javascript var url = document.referrer; ``` `document.referrer`属性返回当前页面的上一个页面的URL。 2. 通过`window.location`： ```javascript var url

在网页开发中，获取上一个页面的 URL 是一个常见的需求，无论是为了实现用户追踪、页面跳转，还是为了展示用户的历史访问记录。JavaScript 提供了多种方法来获取上一个页面的 URL，以下是一些常用且有效的方法，并附上相应的代码示例。

方法一：使用 history 对象

history 对象是浏览器提供的一个接口，允许网页与浏览器的历史记录进行交互。其中，document.referrer 属性可以用来获取当前页面的上一个页面的 URL。

var url = document.referrer;
console.log(url); // 输出上一个页面的 URL

这种方法简单直接，但需要注意的是，如果用户直接输入 URL 访问当前页面，或者通过书签访问，document.referrer 可能会返回一个空字符串。

方法二：通过 window.location

window.location 对象提供了有关当前 URL 的信息。你可以使用 window.location.href 获取完整的 URL，或者使用 window.location.pathname 获取 URL 中的路径和查询字符串。

var url = window.location.href; // 获取完整的 URL
// 或者
var url = window.location.pathname; // 获取路径和查询字符串
console.log(url);

这种方法同样简单，但与 history 对象的方法一样，它不会在用户直接输入 URL 或通过书签访问时提供有用的信息。

方法三：利用 performance API

performance API 提供了关于页面加载性能的信息。使用 performance.getEntriesByType('navigation')[0] 可以获取到上一个页面的信息，包括其 URL。

var entry = performance.getEntriesByType('navigation')[0];
var url = entry.fetchStart + ' ' + entry.name;
console.log(url);

这种方法能获取到完整的 URL，但需要注意的是，它依赖于浏览器的 performance API 支持，并不是所有浏览器都支持这个 API。

方法四：使用 sessionStorage 或 localStorage

sessionStorage 和 localStorage 是 Web Storage API 的一部分，它们允许网页存储数据。你可以在离开页面时将上一个页面的 URL 存储到 localStorage 或 sessionStorage 中，然后在进入新页面时读取。

// 离开页面时
sessionStorage.setItem('previousUrl', window.location.href);

// 进入新页面后
var previousUrl = sessionStorage.getItem('previousUrl');
console.log(previousUrl);

这种方法适用于那些需要在页面之间保持上下文信息的应用，但要注意数据存储的局限性，例如存储空间有限。

总结

选择哪种方法取决于你的具体需求。如果你需要获取上一个页面的完整 URL，并且浏览器支持 performance API，那么使用 performance API 是一个不错的选择。如果你只是需要简单的引用，那么 history 对象和 window.location 可能就足够了。而对于需要在多个页面间共享数据的情况，使用 sessionStorage 或 localStorage 是一个可行的方案。

无论选择哪种方法，都要考虑到兼容性和性能因素，确保你的网页在不同的浏览器和设备上都能正常工作。