Co to jest, gdy link ma znak „#” w kształcie krzyżyka

95

Po sprawdzeniu niektórych witryn mają one w adresie URL znak funta (#). Co to robi?

 <a href="#" >Link name</a>
html Łukasza 101
źródło

Odpowiedzi:

107

To „fragment” lub „nazwana kotwica”. Możesz użyć łącza do części dokumentu. Zwykle po utworzeniu łącza do strony przeglądarka otwiera ją u góry strony. Ale łączysz się z sekcją w połowie drogi, możesz użyć fragmentu, aby połączyć się z tym nagłówkiem (lub czymkolwiek).

Jeśli na stronie nie ma <a name="whatever"/>tagu, przeglądarka po prostu przekieruje na górę strony. Jeśli fragment jest pusty, będzie również zawierał link do góry strony.

Dla fragmentu tylko <a href="#">Link name</a> , to jest to po prostu link do górnej części bieżącej strony.

Często widzisz tego rodzaju odsyłacze w połączeniu z javascript. Zgodny ze standardami HTML wymaga hrefatrybutu, ale jeśli planujesz obsłużyć żądanie za pomocą javascript, wówczas „#” służy jako rozsądny symbol zastępczy.

Dean Harding
źródło
1
+1 Chociaż oficjalnym terminem jest fragment adresu URL, a nie „odniesienie do skrótu”: w3.org/TR/WD-html40-970708/htmlweb.html#h-4.1.1
Jason Hall
Tak, zmieniłem to na „fragment” w mojej odpowiedzi, ponieważ tego używa większość ludzi. Nigdy nie wiedziałem, że ma "oficjalną" nazwę :)
Dean Harding
2
Dlaczego przeglądarki traktują to jako „przejdź na górę strony”: Technicznie rzecz biorąc, strona została zmieniona. Po kliknięciu linku zauważysz, że # jest faktycznie dodawany do adresu URL w pasku adresu, a jeśli klikniesz przycisk Wstecz, ponownie go usunie. Nie powiedziałbym, że jest to łącze do części dokumentu, a raczej łącze do miejsca w dokumencie. Poza tym w zasadzie to samo co pisałem ...
animuson
URI kończące się znakiem # jest dozwolone przez składnię ogólną i może być traktowane jako rodzaj pustego fragmentu. W dokumentach typu MIME, takich jak text / html lub dowolnego typu XML, puste identyfikatory pasujące do tej konstrukcji legalnej składni nie są dozwolone. Przeglądarki internetowe zazwyczaj wyświetlają górę dokumentu dla pustego fragmentu. - en.wikipedia.org/wiki/Fragment_identifier
IcyBrk
Także „jeśli nie jest takie przedstawienie nie istnieje, semantyka fragmentu są znane i są uważane za skuteczne nieograniczona”. Z rfc3986 ( tools.ietf.org/html/rfc3986#page-24 )
IcyBrk
23

... tylko po to, aby dodać kilka dodatkowych przydatnych wskazówek.

Możesz uzyskać do niego dostęp i zmienić go document.location.hashw JavaScript.

Może wskazywać na nazwaną kotwicę (np. <a name="top"></a>) Lub element z odpowiednim identyfikatorem (np <div id="top"></div>.).

Samo zobaczenie (np. <a href="#" onclick="pop()">popup</a>) Generalnie oznacza, że ​​łącze jest używane wyłącznie do uruchamiania JavaScript. To zła praktyka.

Każdy aelement powinien mieć znak hrefwskazujący na prawidłowy zasób. Jeśli takiego nie ma, rozważ użycie innego elementu, takiego jak button.

Alex
źródło
1
To dobra uwaga, nie jest to szczególnie dobra praktyka ... ale tylko dlatego, że nie jest dobra, nie oznacza, że ​​nie będzie używana w ten sposób wszędzie :)
Dean Harding
1
@alex, jeśli to zła praktyka, powiedz nam, jaką dobrą praktyką byłoby użycie zamiast niej.
Ryan Lundy
@Kyralessa To było w następnym akapicie. W każdym razie dokonałem edycji, więc mam nadzieję, że jest ona bardziej przejrzysta.
Alex
2
@alex, prawdopodobnie jednym z powodów, dla których ludzie używają linków zamiast przycisków, jest to, że chcą wyglądać jak linki. Co powiesz na link do strony opisującej, jak sprawić, by przycisk wyglądał jak link? Np. Test przycisku HTML
Ryan Lundy
1
@alex, nic więcej niż stwierdzenie, że używanie znaku # na łączu jest złą praktyką. Wszystko, o co pyta OP, to to, co robi.
Ryan Lundy
11

# wskazuje łącze do kotwicy.

Myślę, że wspomnę też o czymś innym:

Używanie '#' jako href dla linku, który aktywuje JavaScript jest złe, ponieważ przewija stronę do góry - co prawdopodobnie nie jest tym, czego chcesz. Zamiast tego użyj javascript:void(0).

Nathan Osman
źródło
+1 za wzmiankę, że kliknięcie tych linków zmusza stronę do przewinięcia do góry.
Chris Calo
4
Nie potrzebujesz już kotwicy. Od HTML5 (a może i HTML 4) każdy element ze znacznikiem <id> może być celem identyfikatora fragmentu. Zobacz dokumentację HTML5: whatwg.org/specs/web-apps/current-work/multipage/…
Basil Bourque
2
Nie używaj javascript:void(0)też - użyj a, buttonjeśli to nie jest łącze.
Alex
11

Krzyżyk ( #) wskazuje, aby zlokalizować kotwicę na stronie. Na przykład, jeśli umieścisz to gdzieś na stronie:

<a name="foo"></a>

lub ostatnio:

<div id="foo">*part of page*</div>

a następnie klikniesz link na stronie, która ma href #foo, spowoduje to przejście do zakotwiczenia z nazwą lub dividentyfikatorem foo.

Jeśli jednak masz tylko atrybut href #, będzie on prowadził na górę strony.

ElectroBit
źródło
2

To prowadzi z powrotem do samej strony. Jest często używany z linkami, które faktycznie uruchamiają JavaScript.


źródło