Soll ich HTML-Anker mit "name" oder "id" erstellen?

Question

Wenn man sich auf einen Teil einer Webseite mit dem " http://example.com/#foo " Methode, sollte man die

<h1><a name="foo"/>Foo Title</h1>

o

<h1 id="foo">Foo Title</h1>

Beide funktionieren, aber sind sie gleichwertig, oder gibt es semantische Unterschiede?

Answer 1

Achtung für JavaScript-Benutzer: alle IDs werden zu globalen Variablen unter Fenster .

<h1 id="foo">Foo Title</h1>

Ich habe gerade das JS global erstellt:

window.foo

Der Wert von window.foo wird die HTMLElement für die h1 .

Wenn Sie nicht garantieren können, dass alle Werte, die in id Attribute sicher sind, können Sie es vorziehen, sich an name :

<h1 name="foo">Foo Title</h1>

Answer 2

Die ID-Methode wird in älteren Browsern nicht funktionieren, die Anker-Name-Methode wird in neueren HTML-Versionen veraltet sein... Ich würde mich für id entscheiden.

Answer 3

Es gibt keinen semantischen Unterschied; der Trend in den Normen geht in Richtung der Verwendung von id statt name . Es gibt jedoch Unterschiede, die dazu führen können, dass man Folgendes bevorzugt name in einigen Fällen. Die HTML 4.01-Spezifikation bietet die folgenden Hinweise :

Utilice id ou name ? Die Autoren sollten bei der Entscheidung über die Verwendung folgender Punkte berücksichtigen id ou name für einen Ankernamen:

• Das id-Attribut kann mehr als nur ein Ankername sein (z. B. ein Stylesheet-Selektor, ein Verarbeitungsbezeichner usw.).
• Einige ältere User Agents unterstützen keine Anker, die mit dem Attribut id erstellt wurden.
• Das Attribut name ermöglicht umfangreichere Ankernamen (mit Entitäten).

Answer 4

In html 5 wird die id="" Attribut definiert einen eindeutigen Bezeichner für ein Element, das auch ein Anker für einen Fragment-Link ist. In früheren HTML-Standards wurde das name="" Attribut des <a> Element definiert einen Anker für einen Fragment-Link. Ich empfehle etwas wie:
<a name="foo" id="foo"></a><h1>Foo Title</h1>
Da die Unterstützung für die id="" Attribut ist ein wenig lückenhaft (obwohl die neuesten Versionen aller wichtigen Browser es unterstützen, sind die Versionen, die es nicht unterstützen, nicht älter als ein paar Jahre [und es ist am besten, etwas nicht zu zerstören, wenn es keinen guten Grund dafür gibt]). Es ist kompatibel und stilisiert nicht, was auch immer in dem verlinkten Element ist, denn das schließende </a> ist immer noch außerhalb des Elements, aber es ist immer noch in allen aktuellen Standards gültig.

Stellen Sie sicher, dass die name="" y id="" Attribute der <a> Element sind identisch.

Answer 5

Ich habe eine Webseite, die aus einer Reihe von vertikal gestapelten Div-Containern besteht, die im Format identisch sind und sich nur in der Seriennummer unterscheiden. Ich wollte den Namensanker oben in jedem div ausblenden. Die wirtschaftlichste Lösung bestand darin, den Anker als id in das öffnende div-Tag einzufügen, d. h,

<div id="[serial number]" class="topic_wrapper">