Using the same redirect function in two different pages

Question

Ok so my index page has this header with the login option and i selected the buttons using these two functions

function getHeaderButtons() {
    const showHidePopUp = document.querySelector('.titleAndMenuIcon > img')
    const windowPopUP = document.querySelector('.mobilePopUp')
    const main = document.querySelector('main')
    

    showHidePopUp.addEventListener('click', () => {
        windowPopUP.classList.toggle('moveUpAndDown')
        console.log('ok')
        
    })
}

function getLoginAndSubscribeButtons() {
    const login = document.querySelector('.mobilePopUp__login')
    const subscribe = document.querySelector('.mobilePopUp__subscribe')

    login.addEventListener('click', () => {
        window.location.href = "./src/pages/loginPage.html"
    })

    subscribe.addEventListener('click', () => {
        window.location.href = './src/pages/subscribePage.html'
    })
}

and these are working perfectly fine in my HOME PAGE, the problem begins when i export these functions to other pages (so i don't have to rewrite 'em all over again)

This is the message that is shown enter image description here

i wanted a manner to, even the subscribe button is clicked within the subscribe page it redirects again to the subscribe page. Is there a manner to do that?

I tried to look into an wildcard that represents the home page so it could alawys refers to my index page

Answer 1

use absolute path

/src/pages/loginPage.html

Answer 2

Problem: You are using a relative path, which means that the file URL will be based on the CURRENT location.

RELATIVE Example:

CURRENT PAGE: domain.com/index.html
window.location.href = "./src/pages/loginPage.html"
FINAL URL: /src/pages/loignPage.html

CURRENT PAGE: domain.com/blogs/pets.html
window.location.href = "./src/pages/loginPage.html"
FINAL URL: /blogs/src/pages/loignPage.html

Solution: Use an absoulte path, that way the current file location doesn't matter and the file URL will remain the same.

window.location.href = "/src/pages/loginPage.html"