Set an anchor element's href relative to the current URI?

Question

Im on the page:

example.com/news

It's a list of news articles. Is it possible to set links on each news article and take into account the current url?

<a href="the-article">link to something</a>

The above will link to:

example.com/news/article

Or will I need to get the entire route and specify that in the link?

The url could be anything eg. /products so I do not want to hardcode it in.

Configure the server to redirect `example.com/news` to `example.com/news/` — Oriol, Dec 03 '15 at 15:11
Possible duplicate of [Relative path or url for html src and href attributes](http://stackoverflow.com/questions/7503130/relative-path-or-url-for-html-src-and-href-attributes) — Asons, Dec 03 '15 at 15:15
This post might as well be helpful: http://stackoverflow.com/questions/2005079/absolute-vs-relative-urls — Asons, Dec 03 '15 at 15:18
Please not that, this question is not a duplicate of above linked. See my answer below. — ufukty, Jul 02 '23 at 15:18

score 1 · Answer 1 · answered Dec 03 '15 at 15:12

1

If you need to take into account the current path, use the page name directly in the href attribute:

If you are on example.com/news and used an href value of "article", the URL becomes example.com/news/article.

If you need to reference pages on the root directory, precede the page name with slash '/', href="/article".

answered Dec 03 '15 at 15:12

Oday Fraiwan

1,147
1
9
21

I've tried using but it just goes back to site route: example.com/article where it should be example.com/news/article – panthro Dec 03 '15 at 15:13

ufukty · Answer 2 · 2023-07-02T15:51:31.107

1

Browser replaces the part comes after the last / of open page's URL to produce absolute URL from relative path. Either:

Use filenames at the end of your URLs (like news/index.html)
Use / at the end of your URLs (like news/)
Use absolute URLs instead of relative paths for href (like example.com/news/the-article)

Set a base element to guide the browser to add last /

<base href="http://example.com/news/the-article/" />

edited Jul 02 '23 at 15:51

answered Jul 02 '23 at 15:40

ufukty

312
3
10

This should be marked as the answer. – fmg Jul 28 '23 at 14:20

shennan · Answer 3 · 2015-12-03T15:32:45.993

0

Make it relative?

<a href="./article">link to something</a>

For some browsers/DOCTYPE, you may have to use this in conjunction with the base tag element, which will need to be added to every page that utilises relative paths:

<base href="http://www.example.com/news">

edited Dec 03 '15 at 15:32

answered Dec 03 '15 at 15:13

shennan

10,798
5
44
79

this just goes back to example.com/article – panthro Dec 03 '15 at 15:14

Set an anchor element's href relative to the current URI?

3 Answers3