Wykryto działanie AdBlocka!

Prawdopodobnie masz właczonego Adblocka. Korzystanie z bloga jest całkowicie darmowe. Jeśli jednak chcesz docenić prace autora, wyłacz blokowanie reklam dla tej witryny, aby jeszcze bardziej zmotywowac autora do dalszej pracy oraz częstszej publikacji artykułów.

Dziękuje :)

Treść główna bloga

Artykuły

Obiekt location w Javascript – informacje o obecnym adresie URL


JavascriptW skryptowym języku JavaScript, który jest powszechnie wykorzystywany aby udogodnić korzystanie ze strony internetowej internautom, istnieje obiekt location, dzięki któremu możemy uzyskać informacje na temat aktualnego adresu URL. Obiektu location może być używany wraz z obiektem window i jest dostępny za pośrednictwem kodu window.location lub location.method/property. Obiekt ten pozwala nam wyodrębnić poszczególne składowe adresu URL, takie jak: protokół, nazwę hosta, czy też cały adres www. W skład tego obiektu wchodzi 8 właściwości oraz 3 metody.

Właściwości:

1. hostname – zwraca nazwę hosta, przypisanego do danej witryny internetowej, np. dla http://rynko.pl/, nazwą hosta będzie rynko.pl.

Przykładowy kod:

2. href – zwraca całkowity adres URL

Przykładowy kod:

3. protocol – zwraca protokół, którego używa strona www. Na przykład, protokół dla http://rynko.pl/ to http:. O innych protokołach możesz przeczytać tutaj.

Przykład:

4. search – zwraca ciąg przekazany w adresie URL, np.: ?action=search&string=some+string

Przykładowy kod:

Dodatkowo można te zmienne wyodrębnić za pomocą funkcji split.

5. Port – zwraca port obecnego adresu URL.

Przykładowy kod:

Uwaga! Domyślnym portem jest port 80. Jeśli nic nie zostanie zwrócone oznacza, że port jest ustawiony jako domyślny.

6. Hash – zwraca hash z adresu URL.

Przykładowy kod:

Jeśli adresu URL wygląda tak: http://example.com/#top, to location.hash zwróci: #top.

Metody:

1. assign – ładuje nowy dokument.

Przykładowy kod:

Różnica pomiędzy metodą assign i replace jest taka, że replace usuwa wpis z historii przeglądarki o tym, że załadowano nowy dokument, przez co nie można wrócić do poprzedniej strony.

2. replace – ładuje nowy dokument.

Przykładowy kod:

Aby zobaczyć różnicę pomiędzy replace i assign wróć do wyjaśnienia z metody assign.

3. reload – przeładowuje obecną stronę(dokument).

Przykładowy kod:

Jeśli jako argument podany false lub nie wpiszemy żadnych argumentów strona zostanie przeładowania z udziałem cache, natomiast jeśli podamy w argumencie true strona zostanie pobrana z serwera.

Podsumowując, za pomocą obiektu location możemy manipulować adresami URL. Przykładowo metoda reload() może się przydać jeśli chcemy odświeżyć treść po dodaniu jakichś nowych danych do serwisu.

  • W skryptowym języku JavaScript[…]

    Jakim? Nie powiesz mi, że taki ES5/6 jest skryptowy 😉
    de facto nie wspomniałeś o jednej, bardzo ważnej własności: pathname. bardzo pomocna jeśli idziemy w kierunku koncepcji client side routera