LOCATION!
Nazwa
|
Znaczenie
|
Dostępność
|
hash
|
Część adresu URL znajdująca się za znakiem #.
|
FF, IE3, NN2, OP7
|
host
|
Część adresu URL zawierająca nazwę hosta oraz numer portu.
|
FF, IE3, NN2, OP7
|
hostname
|
Część adresu URL zawierająca nazwę hosta.
|
FF, IE3, NN2, OP7
|
href
|
Pełny adres URL.
|
FF, IE3, NN2, OP7
|
pathname
|
Część adresu URL zawierająca ścieżkę dostępu i nazwę pliku.
|
FF, IE3, NN2, OP7
|
port
|
Część adresu URL zawierająca numer portu.
|
FF, IE3, NN2, OP7
|
protocol
|
Część adresu URL zawierająca nazwę protokołu (np.http, ftp).
|
FF, IE3, NN2, OP7
|
search
|
Część adresu URL znajdująca się za znakiem zapytania.
|
FF, IE3, NN2, OP7
|
Metody :
reload - Wczytuje ponownie
assaint - Wczystuje nam dokument
Replace - Zastepuję nam bieżacy dokument przez wskazany adres
1. hostname – zwraca nazwę hosta, przypisanego do danej witryny internetowej, np. dla http://rynko.pl/, nazwą hosta będzie rynko.pl.
Przykładowy kod:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
</head>
<body>
<div id="hostname">
</div>
<script>
var hostname = "Twoja nazwa hosta to: " + location.hostname;
document.getElementById("hostname").innerHTML = hostname;
</script>
</body>
</html>
|
2. href – zwraca całkowity adres URL
Przykładowy kod:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
</head>
<body>
<div id="href">
</div>
<script>
var href = "Całkowity adres URL to: " + location.href;
document.getElementById("href").innerHTML = href;
</script>
</body>
</html>
|
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:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
</head>
<body>
<div id="protocol">
</div>
<script>
var protocol = "Protokół, którego używa strona to: " + location.protocol;
document.getElementById("protocol").innerHTML = protocol;
</script>
</body>
</html>
|
4. search – zwraca ciąg przekazany w adresie URL, np.: ?action=search&string=some+string
Przykładowy kod:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
</head>
<body>
<div id="search">
</div>
<script>
var search = "Parametry w adresie URL to: " + location.search;
document.getElementById("search").innerHTML = search;
</script>
</body>
</html>
|
Dodatkowo można te zmienne wyodrębnić za pomocą funkcji split.
5. Port – zwraca port obecnego adresu URL.
Przykładowy kod:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
</head>
<body>
<div id="port">
</div>
<script>
var search = "Używany port to: " + location.port;
document.getElementById("port").innerHTML = port;
</script>
</body>
</html>
|
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:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
</head>
<body>
<div id="hash">
</div>
<script>
var search = "Hash z adresu URL: " + location.hash:
document.getElementById("hash").innerHTML = hash;
</script>
</body>
</html>
|
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:
1
2
3
4
5
6
7
8
9
10
11
|
<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
</head>
<body>
<script>
location.assign("https://google.com");
</script>
</body>
</html>
|
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:
1
2
3
4
5
6
7
8
9
10
11
|
<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
</head>
<body>
<script>
location.replace("https://google.com");
</script>
</body>
</html>
|
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:
1
2
3
4
5
6
7
8
9
10
11
|
<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
</head>
<body>
<script>
location.reload(false);
</script>
</body>
</html>
|
<html lang="pl">
<head>
</head>
<body>
<script>
function przekierowanie()
{
window.location.replace("http://zszwg.edu.pl");
}
setTimeout("przekierowanie()"*,10000);
document.write("Za 10 sekundy nastąpi przekierowanie");
</script>
</body>
</html>
