Javascript: Going to root url (to avoid relative url)

Question

I'm having an issue with urls.

I have a navbar.ejs file that I include in every page of my website via

<% include ./navbar %>

In the file, I have something like this:

<li><a id="loginButton" href="../login">Login</a></li>
<li><a id="signupButton" href="../users/new">Sign up</a></li>

The issue I'm having is that depending on where I am on the website, the login button might or might not work. This is because of

"../login"

So at times when you click the login button, you're directed to https://baseurl/login

At other times, it goes to https://baseurl/campgrounds/login This URL is wrong and doesn't exist.

I know the source of the problem obviously. But how do I get replace "../login" with an absolute URL path... As in, how do I go back to the root?

Something like $("#loginButton).attr("href", document.location.hostname + "/login") doesn't work because it just directs to baseurl/baseurl/login which is also invalid

Answer 1

如果登录页面的 URL 始终是https://yelpcamp-asool.c9users.io/login，那么下面的代码将正常工作。

<a id="loginButton" href="/login">