Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The url
read-only property of the NavigationDestination
interface returns the URL being navigated to.
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The url
read-only property of the NavigationDestination
interface returns the URL being navigated to.
A string.
intercept()
js
navigation.addEventListener("navigate", (event) => { // Exit early if this navigation shouldn't be intercepted, // e.g. if the navigation is cross-origin, or a download request if (shouldNotIntercept(event)) { return; } const url = new URL(event.destination.url); if (url.pathname.startsWith("/articles/")) { event.intercept({ async handler() { // The URL has already changed, so show a placeholder while //fetching the new content, such as a spinner or loading page renderArticlePagePlaceholder(); // Fetch the new content and display when ready const articleContent = await getArticleContent(url.pathname); renderArticlePage(articleContent); }, }); } });
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
url |
102 | 102 | No | No | 88 | No | 102 | 102 | No | 70 | No | 19.0 |
© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/NavigationDestination/url