let lastUrl = location.href;
new MutationObserver(() => {
const url = location.href;
if (url !== lastUrl) {
lastUrl = url;
onUrlChange();
}
}).observe(document, {subtree: true, childList: true});
function onUrlChange() {
alert('URL changed!', location.href);
}
Funkcia MutationObserver()
sa používa na zistenie alebo sledovanie zmien vykonaných v strome DOM. Jednoducho zisťuje zmeny prvku DOM a tiež zmeny adresy URL na jednostránkových webových stránkach, ako sú React JS a Angular JS.
Vysvetlenie funkcie:
- V uvedenom kóde najprv vezmeme aktuálnu adresu URL stránky pomocou location.href;
- Potom použijeme metódu MutationObserver, ktorá observe() nakonfiguruje spätné volanie MutationObserver, aby začalo dostávať upozornenia na zmeny v DOM , ktoré zodpovedajú daným možnostiam.
- Nakoniec porovnáme adresy URL a potom zavoláme funkciu, ktorá vyzve novú adresu URL umiestnenia.
zdroj:
https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver