Search code examples
htmlfragment-identifierpage-jump

Why are identically implemented HTML anchors/IDs working in one case but not the other?


I have created a website which allows the user to jump to a chapter from the Table of Contents. It works in one book "Huck Finn" but not the other "Rouging It."

The code seems exactly the same to me. And, in fact, it works in "Roughing It" in the jsfiddle

Here is a representative row and the beginning of the chapter that it jumps to in "Huck Finn":

    <tr>
        <td><a href="#chap1">CHAPTER I. Civilizing Huck. Miss Watson. Tom Sawyer Waits.</a>
        </td>
    </tr>
. . .
<p class="chapter"><a id="chap1"></a>CHAPTER I. Civilizing Huck. Miss Watson. Tom Sawyer Waits.</p>

...and here is the first chapter in "Roughing It":

        <tr>
            <td>
                <a href="#chap1">
                    CHAPTER I. My Brother appointed Secretary of Nevada--I Envy His Prospective Adventures--Am Appointed Private Secretary Under Him--My Contentment Complete--Packed in One Hour--Dreams and Visions--On the Missouri River --A Bully Boat
                </a>
            </td>
        </tr>

    . . .

<p class="chapter"><a id="chap1"></a>CHAPTER I.</p>

(It's true that in "Roughing It" I did not add the synopsis of the chapter "in place" - just in the TOC. That shouldn't matter, though...

So why does it work in Huck Finn and in jsfiddle, but not when running from Visual Studio? IOW, in jsfiddle, both work ("Huck Finn" and "Roughing It"); in Visual Studio, only "Huck Finn" works).

UPDATE

Oddly enough, I just realized that the links from chap43 on DO work; only 1-42 do not work...?!?

UPDATE 2

Aha! (Epiphany/Eureka): "Huck Finn" has 42 chapters, so "chap1" through "chap42" are seen as its IDs; from chap43 on are "free" so "Roughing It" gets them. I will have to make them unique, such as "RIchap1".."RIchap79"


Solution

  • The IDs have to be unique; since I had "chap1" in "Huck Finn", I could not also have "chap1" in "Roughing It." Once I changed it to "RIchap1" it worked like a charm bracelet.

    Why that would be, I don't know, though, because there's only one "chap1" in each .html file - wouldn't "it" know to look only within itself?