How to point to an anchor when the fragment identifier is already used in the URL?

Question

I have a page (over which I have no control) with an URL similar to

https://example.com/#group:1106/about:Bxk9H9jJQOm-pYkmpZVjhA

Within this page, there is an element

<h1 id="content-H1-59520">Introduction</h1>

Fragment identifiers (#) can be used to point to a specific id on a page:

In URIs for MIME text/html pages such as http://www.example.org/foo.html#bar the fragment refers to the element with id="bar".

My question: taken into account that the fragment identifier is already used in the bare URL, how should I modify it to have it pointing to the H1 element above?

On a hunch I tried https://example.com/#group:1106/about:Bxk9H9jJQOm-pYkmpZVjhA#content-H1-59520 but it does not work.

Answer 1

The fragment identifier component is indicated by the first # and terminated by the end of the URL. The URL you tested is invalid, because the fragment identifier component may not contain a #.

The URL has to be:

https://example.com/#content-H1-59520

If a JavaScript-based site requires the fragment identifier to represent application states, it conflicts with the browser feature to jump to an ID.

You could either switch to a different URI design (that doesn’t require the fragment identifier component), or maybe you could rebuild the jump feature in JavaScript (e.g., appending the anchor ID to the fragment, delimited by @).