Sep 19
Usuwanie wszystkiego przed hashem w URLu (JS)
Dzisiaj miałem dość ciekawą sytuację, której rozwiązanie zajęło mi dobre 20 minut. Otóż na linki nałożyłem event onClick. Po kliknięciu na nie odczytywałem z atrybutu ‘href’ co tam w nich jest (dodam, że każdy url miał href’a - “#cos”), usuwałem hash’a i wykonywałem jakąś czynność w zależności od tego co zawierał.
Usuwanie hasha wykonywałem całkiem banalnie. Najpierw za pomocą metody Mootoolsowej pobierałem atrybut ‘href’ (metodą getAttribute) i później już tylko zamieniałem:
href.replace(/#/, '');
Oczywiście Firefox łykał to wszystko bardzo ładnie. Niestety IE7 już nie. Co się okazało ? IE wstawiało do atrybutu href pełen adres przez co zamiast mieć tam “#foo” miałem “http://serwer.com/#foo”. Jak łatwo można się domyślić nie byłem w stanie wyłapać tylko tego co jest za hashem, dlatego trzeba było nieco zmodyfikować pattern na coś takiego:
href.replace(/.*#/, '');
Teraz wszystko gra i efekt jest dokładnie taki jaki miał być :) Dziwne są cuda IE :P
PS. sprawdziłem sobie na innej stronce podobny mechanizm, ale w surowym JSie. Wszystko wskazuje na to, że to JSowe frameworki same wycinają pełną nazwę hosta. Na stronie
jogger.pl odpaliłem z konsoli JS Firebuga taki kod:
document.getElementsByClassName('next')[0].href
Wynikiem był pełen URL, wraz z nazwą hosta. Natomiast wykorzystany na tamtej stronie
jQuery zwracał jedynie wartości od hash’a do końca linii.
October 1st, 2008 at 12:08
Nie musisz usuwać #. Wystarczy zrobić zastopować event po kliknięciu (w mootool metoda stop dostępna jest w każdym obiekcie Event).
Jeszcze mała ciekawostka, do parametru w # można dostać się przez window.location.hash.
November 7th, 2008 at 12:25
Gdy przeczytałem o wycinaniu tego co przed hashem, to zamiast używania replace’a do głowy przyszło mi rozwiązanie: href.substring(href.indexOf(’#')) oraz href.split(’#')[1]. Ciekawe które jest najszybsze…
FireBug Profiler (Fx3) mówi:
>>> function usingReplace(){ return href.replace(/.*#/, ''); }
>>> function usingSubstring(){ return href.substring(href.indexOf('#')+1); }
>>> function usingSplit(){ return href.split('#')[1]; }
Profiler (0.321ms, 5 wywołań)
Funkcja | Czas wywołania
usingReplace 0.019ms
usingSplit 0.005ms
usingSubstring 0.004ms
Nie używałem żadnych frameworków. A test przeprowadzony dla zmiennej href długości 107 znaków, przy czym do znaku # jest ich 73.
Więc widać, że split mimo wszystko najszybszy ;-)
Pozdrawiam,
Rafał.
November 7th, 2008 at 12:30
A… Substring. ;-) Ach, zmyliłem się tym, że deklarowałem jako ostatnią usingSplit(). :P