Poniżej przedstawiono dwie metody budowania łącza, którego jedynym celem jest uruchomienie kodu JavaScript. Co jest lepsze pod względem funkcjonalności, szybkości ładowania strony, celów sprawdzania poprawności itp.?
function myJsFunc() {
alert("myJsFunc");
}
<a href="#" onclick="myJsFunc();">Run JavaScript Code</a>
lub
function myJsFunc() {
alert("myJsFunc");
}
<a href="javascript:void(0)" onclick="myJsFunc();">Run JavaScript Code</a>
javascript
html
performance
optimization
href
Peter Mortensen
źródło
źródło
<a href="javascript:void(0)" onclick="myJsFunc();">
ma absolutnie żadnego sensu. Jeśli musisz użyćjavascript:
protokołu psuedo, nie potrzebujesz również tegoonclick
atrybutu.<a href="javascript:myJsFunc();">
zrobi dobrze.myJsFunc()
ma wartość zwracaną, twoja strona się zepsuje . jsfiddle.net/jAd9G ci, że nadal trzeba używaćvoid
tak:<a href="javascript:void myJsFunc();">
. Ale zachowanie nadal by się różniło. Wywołanie łącza za pomocą menu kontekstowego nie wyzwalaclick
zdarzenia.<a href="javascript:;" onclick="myEvent()"
?javascript:;
jest o wiele szybszy do pisania niżjavascript:void(0)
<a>
tagu, jeśli NIE chcesz otworzyć innej strony za pomocą natywnej funkcji przeglądarki, ale raczej uruchomić pewne„ działanie ”javascript? Wystarczy użyćspan
tagu z klasąjs-trigger
prawdopodobnie znacznie lepiej ". A może coś mi brakuje?Odpowiedzi:
Używam
javascript:void(0)
.Trzy powody. Zachęcanie do korzystania z
#
zespołu programistów nieuchronnie prowadzi do tego, że niektórzy używają wartości zwracanej funkcji o nazwie tak:Ale potem zapominają używać
return doSomething()
w kliknięciu i po prostu używaćdoSomething()
.Drugim powodem unikania
#
jest to, że finałreturn false;
nie zostanie wykonany, jeśli wywoływana funkcja zgłosi błąd. Dlatego programiści muszą również pamiętać, aby odpowiednio obsługiwać każdy błąd w wywoływanej funkcji.Trzecim powodem są przypadki, w których
onclick
właściwość zdarzenia jest przypisywana dynamicznie. Wolę mieć możliwość wywoływania funkcji lub przypisywania jej dynamicznie, bez konieczności kodowania funkcji specjalnie dla jednej metody dołączania lub innej. Stąd mojeonclick
(lub cokolwiek) znaczniki HTML wyglądają tak:LUB
Używanie
javascript:void(0)
pozwala uniknąć wszystkich powyższych bólów głowy i nie znalazłem żadnych przykładów wad.Więc jeśli jesteś samotnym programistą, możesz wyraźnie dokonać własnego wyboru, ale jeśli pracujesz jako zespół, musisz określić:
Użyj
href="#"
, upewnij się, żeonclick
zawsze zawierareturn false;
na końcu, że dowolna wywoływana funkcja nie zgłasza błędu, a jeśli funkcja zostanie dołączona dynamicznie doonclick
właściwości, upewnij się, że nie zwróci ona błędufalse
.LUB
Posługiwać się
href="javascript:void(0)"
Drugi jest wyraźnie znacznie łatwiejszy do komunikowania się.
źródło
href="javascript:void(0)"
metodyjavascript:
powinno być uważane za złą praktykę, natrętne i nie oznacza wdzięcznego obniżenia oceny.event.preventDefault()
mają dokładnie zapobiegać domyślnemu zachowaniu (np. Przeskakiwaniu na górę strony w tym przypadku) i wykonywać lepszą pracę bezreturn false;
szaleństwa.javascript:void(0)
narusza Politykę bezpieczeństwa treści na stronach HTTPS z obsługą CSP. Jedną z opcji byłoby użyciehref='#'
ievent.preventDefault()
w module obsługi, ale nie bardzo mi się to podoba. Być może możesz ustanowić konwencjęhref='#void'
i upewnić się, że żaden element na stronie nie maid="void"
. W ten sposób kliknięcie łącza do nieistniejącej kotwicy nie spowoduje przewinięcia strony.href
. Odbyłoby się to w jQuery z:$('a[href="#"]').click(function(e) { e.preventDefault ? e.preventDefault() : e.returnValue = false; });
Ani.
Jeśli możesz mieć rzeczywisty adres URL, który ma sens, użyj go jako HREF. Onclick nie uruchomi się, jeśli ktoś kliknie link środkowy, aby otworzyć nową kartę lub jeśli ma wyłączoną obsługę JavaScript.
Jeśli nie jest to możliwe, należy przynajmniej wstrzyknąć tag zakotwiczony do dokumentu za pomocą JavaScript i odpowiednich procedur obsługi zdarzeń kliknięcia.
Zdaję sobie sprawę, że nie zawsze jest to możliwe, ale moim zdaniem należy dążyć do opracowania dowolnej publicznej strony internetowej.
Sprawdź dyskretny JavaScript i ulepszenia progresywne (obie Wikipedia).
źródło
javascript:
lub#
oba są złymi praktykami i nie należy ich zachęcać. Ładne artykuły btw.<button>
została stworzona. Ale zgodził się: prawdopodobnie nie powinno to oznaczać,<a>
że nie ma odpowiedniego miejsca, z którego można by go połączyć.Robienie
<a href="#" onclick="myJsFunc();">Link</a>
lub<a href="javascript:void(0)" onclick="myJsFunc();">Link</a>
cokolwiek innego, co zawieraonclick
atrybut - było w porządku pięć lat temu, choć teraz może to być złą praktyką. Dlatego:Promuje praktykę natrętnego JavaScript - który okazał się trudny do utrzymania i trudny do skalowania. Więcej na ten temat w dyskretnym JavaScript .
Spędzasz czas na pisaniu niewiarygodnie przesadnego kodu - co ma bardzo małą (jeśli w ogóle) korzyść dla twojej bazy kodu.
Istnieją teraz lepsze, łatwiejsze i łatwiejsze w utrzymaniu i skalowalne sposoby osiągnięcia pożądanego rezultatu.
Dyskretny sposób obsługi JavaScript
Po prostu nie mam
href
atrybutu! Każdy dobry reset CSS zająłby się brakującym domyślnym stylem kursora, więc nie jest to problemem. Następnie dołącz swoją funkcjonalność JavaScript za pomocą wdzięcznych i dyskretnych najlepszych praktyk - które są łatwiejsze w utrzymaniu, ponieważ logika JavaScript pozostaje w JavaScript, a nie w znacznikach - co jest niezbędne, gdy zaczynasz opracowywać aplikacje JavaScript na dużą skalę, które wymagają podzielenia logiki na komponenty i szablony w blackboxie. Więcej na ten temat w Architekturze aplikacji JavaScript na dużą skalęProsty przykład kodu
Przykład Backbone.js w czarnej skrzynce
Skalowalny przykład komponentu Backbone.js w postaci czarnej skrzynki - zobacz ten działający przykład jsfiddle tutaj . Zwróć uwagę, w jaki sposób stosujemy dyskretne praktyki JavaScript, aw niewielkiej ilości kodu mamy komponent, który może być wielokrotnie powtarzany na stronie bez skutków ubocznych lub konfliktów między różnymi instancjami komponentu. Niesamowity!
Notatki
Pominięcie
href
atrybutua
elementu spowoduje, że element nie będzie dostępny za pomocątab
nawigacji kluczowej. Jeśli chcesz, aby te elementy były dostępne za pomocątab
klucza, możesz ustawićtabindex
atrybut lubbutton
zamiast tego użyć elementów. Możesz łatwo stylizować elementy przycisków, aby wyglądały jak normalne linki, jak wspomniano w odpowiedzi Tracker1 .Pominięcie
href
atrybutua
elementu spowoduje, że Internet Explorer 6 i Internet Explorer 7 nie przyjmąa:hover
stylu, dlatego dodaliśmy prostą podkładkę JavaScript, aby to osiągnąća.hover
. Co jest całkowicie w porządku, ponieważ jeśli nie masz atrybutu href i nie masz wdzięcznej degradacji, twój link i tak nie będzie działał - i będziesz miał większe problemy do zmartwienia.Jeśli chcesz, aby twoja akcja nadal działała z wyłączoną obsługą JavaScript, użyj
a
elementu zhref
atrybutem, który prowadzi do adresu URL, który wykona akcję ręcznie zamiast przez żądanie Ajax lub cokolwiek innego, co powinno być. Jeśli to robisz, to chcesz upewnić się, że wykonujeszevent.preventDefault()
wywołanie kliknięcia, aby upewnić się, że kliknięcie przycisku nie powoduje kliknięcia linku. Ta opcja nazywa się wdzięczną degradacją.źródło
button
sugerowane tutaj podejście w stylu łącza jest nękane nieuniknionym stanem aktywnym „3d” w IE9 i niższych wersjach .javascript:void(0)
. To jest pragmatyczna odpowiedź i jedyna sensowna odpowiedź w prawdziwym świecie.'#'
zabierze użytkownika z powrotem na górę strony, więc zwykle wybieramvoid(0)
.javascript:;
też zachowuje się jakjavascript:void(0);
źródło
#
lub#something
zabierze Cię do tej kotwicy na stronie href bazy , zamiast na bieżącej stronie.#!
) robi lewę, ale jest to zdecydowanie zła praktyka.Szczerze nie zasugerowałbym żadnej z nich. Użyłbym stylizowanego
<button></button>
do tego zachowania.W ten sposób możesz przypisać swoje kliknięcie. Sugeruję również powiązanie za pomocą skryptu, nie używając
onclick
atrybutu na znaczniku elementu. Jedyny problem to efekt tekstowy 3D psuedo w starszych IE, którego nie można wyłączyć.Jeśli MUSISZ użyć elementu A, użyj go
javascript:void(0);
z powodów już wymienionych.UWAGA: Możesz zastąpić
0
ciąg taki jak,javascript:void('Delete record 123')
który może służyć jako dodatkowy wskaźnik, który pokaże, co faktycznie zrobi kliknięcie.źródło
<button>
aleinput type=button
zamiast tego?<clickable>
elementu. Lub<clickabletim>
jeśli wolisz. Niestety użycie niestandardowego znacznika lub zwykłego div może utrudnić użytkownikom klawiatury skupienie elementu.button
. Na szczęście IE9 szybko traci udziały w rynku, a aktywny efekt 1px nie powinien powstrzymywać nas od używania znaczników semantycznych.<a>
to link, który ma cię gdzieś wysłać, do działań, które mamy<button>
.Pierwszy, najlepiej z prawdziwym linkiem do na wypadek, gdyby użytkownik wyłączył JavaScript. Pamiętaj tylko o zwróceniu wartości false, aby zapobiec uruchomieniu zdarzenia kliknięcia, jeśli JavaScript zostanie wykonany.
Jeśli używasz Angular2, ten sposób działa:
<a [routerLink]="" (click)="passTheSalt()">Click me</a>
.Zobacz tutaj https://stackoverflow.com/a/45465728/2803344
źródło
Ani jeśli mnie zapytasz;
Jeśli „link” ma na celu uruchomienie kodu JavaScript, nie kwalifikuje się jako link; raczej fragment tekstu z dołączoną funkcją JavaScript. Polecam użycie
<span>
tagu zonclick handler
dołączonym do niego i podstawowego CSS, aby naśladować link. Linki są tworzone do nawigacji, a jeśli kod JavaScript nie służy do nawigacji, nie powinien być<a>
tagiem.Przykład:
źródło
<span>
nie są przeznaczone do robienia czegokolwiek.<A>
nchors i<buttons>
są do tego wykorzystywane!buttons
jest tutaj lepszym wyborem, podczas gdy używaniespan
nie jest.Idealnie byłoby to zrobić:
Lub nawet lepiej, będziesz mieć domyślny link akcji w kodzie HTML i dodasz zdarzenie onclick do elementu dyskretnie przez JavaScript po renderowaniu DOM, zapewniając w ten sposób, że jeśli JavaScript nie jest obecny / wykorzystywany, nie będziesz mieć bezużyteczne programy obsługi zdarzeń, które oszukują kod i potencjalnie zaciemniają (lub przynajmniej odwracają uwagę) rzeczywistą treść.
źródło
Używanie
#
powoduje tylko kilka zabawnych ruchów, więc polecam użyć tego,#self
jeśli chcesz zaoszczędzić na pisaniuJavaScript bla, bla,
.źródło
#self
nazwanych tagów i uniknąć irytujących zachowań przeglądarki podczas przeskakiwania na górę strony. Dziękuję Ci.#self
nie wydaje się być wyjątkowy. Każdy identyfikator fragmentu, który nie pasuje do nazwy lub identyfikatora dowolnego elementu w dokumencie (i nie jest pusty lub „górny”), powinien mieć ten sam efekt.#void
innym komentarzu zasugerowałem ustanowienie konwencji, ale w rzeczywistości#self
jest tak krótkie i łatwe do zapamiętania. Wszystko jest lepsze niż#
Używam następujących
zamiast
źródło
javascript:
(bez średnika), ponieważ po najechaniu myszą na pasku stanu wygląda ona najładniej.javascript:void('Do foo')
ponieważ void zwróci niezdefiniowane niezależnie, da użytkownikowi wskaźnik, co zrobi kliknięcie. GdzieDo foo
może byćDelete record X
lub co chcesz.Zgadzam się z sugestiami w innym miejscu, mówiącymi, że powinieneś używać zwykłego adresu URL w
href
atrybucie, a następnie wywołać funkcję JavaScript w kliknięciu. Wadą jest to, że automatycznie dodająreturn false
po rozmowie.Problem z tym podejściem polega na tym, że jeśli funkcja nie będzie działać lub wystąpi jakiś problem, łącze stanie się nieskomplikowalne. Zdarzenie Onclick zawsze zwróci
false
, więc normalny adres URL nie zostanie wywołany.Istnieje bardzo proste rozwiązanie. Pozwól funkcji powrócić,
true
jeśli działa poprawnie. Następnie użyj zwróconej wartości, aby określić, czy kliknięcie powinno zostać anulowane, czy nie:JavaScript
HTML
Zauważ, że neguję wynik
doSomething()
funkcji. Jeśli to zadziała, wrócitrue
, więc zostanie zanegowane (false
) ipath/to/some/URL
nie zostanie wywołane. Jeśli funkcja zwrócifalse
(na przykład przeglądarka nie obsługuje czegoś używanego w funkcji lub coś innego pójdzie nie tak), zostanie to zanegowanetrue
ipath/to/some/URL
zostanie wywołane.źródło
#
jest lepszy niżjavascript:anything
, ale następujące są jeszcze lepsze:HTML:
JavaScript:
Zawsze powinieneś dążyć do pełnej wdzięku degradacji (w przypadku, gdy użytkownik nie ma włączonej obsługi JavaScript ... i gdy jest to zgodne ze specyfikacjami i budżetem). Ponadto uważanie za niewłaściwe korzystanie z atrybutów i protokołu JavaScript bezpośrednio w HTML jest uważane za złą formę.
źródło
click
na linkach…Polecam
<button>
zamiast tego użyć elementu, zwłaszcza jeśli formant ma wywoływać zmianę danych. (Coś jak POST.)Jeszcze lepiej, jeśli wstrzykujesz elementy dyskretnie, rodzaj progresywnego ulepszenia. (Zobacz ten komentarz .)
źródło
.btn
sprawia, że przyciski i linki wyglądają dokładnie tak samo.button
nie wprowadza także # do adresu URL ani nie wyświetlaa
href jako javascript :;O ile nie wypisujesz linku za pomocą JavaScript (abyś wiedział, że jest włączony w przeglądarce), najlepiej dostarczać odpowiedni link dla osób przeglądających z wyłączoną obsługą JavaScript, a następnie uniemożliwić domyślną akcję linku w swoim kliknięciu moduł obsługi zdarzeń. W ten sposób osoby z włączoną obsługą JavaScript uruchomią tę funkcję, a osoby z wyłączoną obsługą JavaScript przejdą na odpowiednią stronę (lub lokalizację na tej samej stronie) zamiast klikać link i nic się nie dzieje.
źródło
Zdecydowanie hash (
#
) jest lepszy, ponieważ w JavaScript jest to pseudoschem:Oczywiście „#” z programem obsługi onclick, który zapobiega domyślnemu działaniu, jest [znacznie] lepszy. Ponadto link, którego jedynym celem jest uruchomienie JavaScript, nie jest tak naprawdę „linkiem”, chyba że wysyłasz użytkownika do jakiejś sensownej kotwicy na stronie (tylko # wyśle na górę), gdy coś pójdzie nie tak. Możesz po prostu symulować wygląd i styl połączenia z arkuszem stylów i całkowicie zapomnieć o href.
Ponadto, w odniesieniu do sugestii cowgod, szczególnie tej:
...href="javascript_required.html" onclick="...
To dobre podejście, ale nie rozróżnia scenariuszy z „wyłączoną obsługą JavaScript” i „niepowodzeniem po kliknięciu”.źródło
Zwykle wybieram
Jest krótszy niż javascript: void (0) i robi to samo.
źródło
Użyłbym:
Powody:
href
proste, wyszukiwarki tego potrzebują. Jeśli użyjesz czegoś innego (np. Łańcucha), może to spowodować404 not found
błąd.return false;
ze strony, strona nie przeskakuje na górę ani nie łamieback
przycisku.źródło
Wybieram użycie
javascript:void(0)
, ponieważ użycie tego może uniemożliwić kliknięcie prawym przyciskiem, aby otworzyć menu zawartości. Alejavascript:;
jest krótszy i robi to samo.źródło
Tak więc, gdy robisz kilka rzeczy JavaScript z
<a />
tagiem i jeśli również wstawiszhref="#"
, możesz dodać return false na końcu zdarzenia (w przypadku powiązania zdarzenia inline), np .:Możesz też zmienić atrybut href za pomocą JavaScript, np .:
lub
Ale semantycznie wszystkie powyższe sposoby osiągnięcia tego są złe (choć działa dobrze) . Jeśli jakikolwiek element nie jest tworzony do poruszania się po stronie i z którym związane są pewne elementy JavaScript, nie powinien to być
<a>
tag.Możesz po prostu użyć
<button />
zamiast tego do zrobienia rzeczy lub dowolnego innego elementu, takiego jak b, zakres lub cokolwiek, co tam pasuje, zgodnie z twoimi potrzebami, ponieważ możesz dodawać zdarzenia do wszystkich elementów.Tak, jest jedna korzyść do użytku
<a href="#">
. Gdy to zrobisz, domyślnie otrzymasz kursor na tym elemenciea href="#"
. W tym celu myślę, że możesz użyć CSS do tego,cursor:pointer;
co również rozwiązuje ten problem.I na koniec, jeśli wiążesz zdarzenie z samego kodu JavaScript, możesz to zrobić,
event.preventDefault()
jeśli używasz<a>
tagu, ale jeśli nie używasz<a>
tagu do tego, masz przewagę, nie „ muszę to zrobić.Jeśli więc widzisz, lepiej nie używać tagu do tego typu rzeczy.
źródło
Nie używaj linków wyłącznie w celu uruchomienia JavaScript.
Użycie href = "#" przewija stronę do góry; użycie void (0) powoduje problemy nawigacyjne w przeglądarce.
Zamiast tego użyj elementu innego niż link:
I stylizuj to za pomocą CSS:
źródło
span
elementu, ponieważ jest to element, na którym nie można ustawić ostrości. Dlatego potrzebujesz przycisku.tabindex="0"
do zakresu. To powiedziawszy, użycie przycisku jest lepsze, ponieważ daje pożądaną funkcjonalność za darmo. Aby był dostępny za pomocą zakresu, musisz nie tylko dołączyć moduł obsługi kliknięć, ale także moduł obsługi zdarzeń klawiatury, który szuka naciśnięć spacji lub klawisza Enter, a następnie uruchamia normalny moduł obsługi kliknięć. Chciałbyś również zmienić drugi selektor CSS na.funcActuator:hover, .funcActuator:focus
tak, aby widoczny był fakt, że element ma fokus.Lepiej byłoby użyć jQuery,
i pomiń oba
href="#"
ihref="javascript:void(0)"
.Znacznik zakotwiczenia będzie podobny
Wystarczająco proste!
źródło
Jeśli używasz AngularJS , możesz użyć następujących opcji:
Co nic nie da.
Dodatkowo
false
z JavaScriptźródło
Jeżeli nie ma
href
być może nie ma powodu, aby używać tagu kotwicy.Możesz dołączyć zdarzenia (kliknięcie, najechanie kursorem itp.) Do prawie każdego elementu, więc dlaczego nie użyć po prostu a
span
lub adiv
?A dla użytkowników z wyłączoną obsługą JavaScript: jeśli nie ma rezerwy (na przykład alternatywy
href
), powinni przynajmniej nie być w stanie zobaczyć tego elementu i wchodzić w interakcje z nim, bez względu na to, czy jest to tag,<a>
czy<span>
tag.źródło
Zwykle zawsze powinieneś mieć link rezerwowy, aby upewnić się, że klienci z wyłączoną obsługą JavaScript nadal mają pewną funkcjonalność. Ta koncepcja nazywa się dyskretnym JavaScript.
Przykład ... Załóżmy, że masz następujący link wyszukiwania:
Zawsze możesz wykonać następujące czynności:
W ten sposób osoby z wyłączoną obsługą JavaScript są przekierowywane,
search.php
podczas gdy twoi widzowie z JavaScript mają dostęp do twojej rozszerzonej funkcjonalności.źródło
Osobiście używam ich w połączeniu. Na przykład:
HTML
z odrobiną jQuery
lub
Ale używam tego tylko do zapobiegania przeskakiwaniu strony na górę, gdy użytkownik kliknie pustą kotwicę. Rzadko używam onClick i innych
on
zdarzeń bezpośrednio w HTML.Moją sugestią byłoby użycie
<span>
elementu zclass
atrybutem zamiast kotwicy. Na przykład:Następnie przypisz tę funkcję do
.link
skryptu owiniętego w treści i tuż przed</body>
tagiem lub w zewnętrznym dokumencie JavaScript.* Uwaga: W przypadku dynamicznie tworzonych elementów użyj:
W przypadku dynamicznie tworzonych elementów, które są tworzone z dynamicznie tworzonymi elementami, użyj:
Następnie możesz zaprojektować element span, aby wyglądał jak kotwica z małym CSS:
Oto przykład wyżej wspomnianego jsFiddle .
źródło
W zależności od tego, co chcesz osiągnąć, możesz zapomnieć o kliknięciu i po prostu użyć href:
To omija potrzebę zwrotu false. Nie podoba mi się ta
#
opcja, ponieważ, jak wspomniano, zabierze użytkownika na górę strony. Jeśli masz gdzieś wysłać użytkownika, jeśli nie ma włączonej obsługi JavaScript (co jest rzadkością tam, gdzie pracuję, ale bardzo dobry pomysł), to proponowana metoda Steve'a działa świetnie.Na koniec możesz użyć,
javascript:void(0)
jeśli nie chcesz, aby ktokolwiek nigdzie jeździł i jeśli nie chcesz wywoływać funkcji JavaScript. Działa świetnie, jeśli masz obraz, który ma się zdarzyć po najechaniu myszką, ale użytkownik nie ma nic do kliknięcia.źródło
Kiedy mam kilka sztucznych linków, wolę dać im klasę „bez linków”.
Następnie w jQuery dodaję następujący kod:
A w przypadku HTML link jest po prostu
Nie lubię używać Hash-Tagów, chyba że są one używane do zakotwiczeń, i robię to tylko wtedy, gdy mam więcej niż dwa fałszywe linki, w przeciwnym razie korzystam z javascript: void (0).
Zazwyczaj lubię po prostu unikać korzystania z linków i po prostu owijać coś wokół siebie i używać tego jako sposobu na aktywację jakiegoś kodu JavaScript, takiego jak wyskakujące okienko lub odsłonięcie zawartości.
źródło
Wierzę, że przedstawiasz fałszywą dychotomię. To nie jedyne dwie opcje.
Zgadzam się z panem D4V360, który zasugerował, że nawet jeśli używasz tagu kotwicy, tak naprawdę nie masz tutaj kotwicy. Wszystko, co masz, to specjalna sekcja dokumentu, która powinna zachowywać się nieco inaczej.
<span>
Tag jest o wiele bardziej odpowiednie.źródło
a
aspan
, musisz pamiętać, aby ustawić ostrość za pomocą klawiatury.Próbowałem obu w Google Chrome z narzędziami dla programistów i
id="#"
zajęło to 0,32 sekundy. Podczas gdyjavascript:void(0)
metoda zajęła tylko 0,18 sekundy. Tak więc w Google Chromejavascript:void(0)
działa lepiej i szybciej.źródło
Zasadniczo parafrazuję ten praktyczny artykuł, używając progresywnego ulepszania . Krótka odpowiedź jest taka, że nigdy nie używasz
javascript:void(0);
lub#
chyba że interfejs użytkownika został już wywnioskować, że JavaScript jest włączona, w takim przypadku należy użyćjavascript:void(0);
. Nie używaj też span jako linków, ponieważ jest to semantycznie fałszywe na początek.Dobrym zwyczajem jest również używanie w aplikacji tras przyjaznych SEO , takich jak / Home / Action / Parameters. Jeśli masz link do strony, która najpierw działa bez JavaScript, możesz później poprawić jej jakość. Użyj prawdziwego linku do działającej strony, a następnie dodaj zdarzenie onlick, aby ulepszyć prezentację.
Oto próbka. Strona główna / ChangePicture to działający link do formularza na stronie wraz z interfejsem użytkownika i standardowymi przyciskami przesyłania HTML, ale ładniej wygląda w modalnym oknie dialogowym z przyciskami jQueryUI. Tak czy inaczej, w zależności od przeglądarki, działa to w pierwszej kolejności.
źródło