Получить текущий URL-адрес с помощью JavaScript?

avatar
dougoftheabaci
23 июня 2009 в 19:26
3122218
26
3303

Все, что мне нужно, это получить URL-адрес веб-сайта. Не URL, взятый из ссылки. При загрузке страницы мне нужно иметь возможность получить полный текущий URL-адрес веб-сайта и установить его как переменную, которую я хочу использовать.

Источник
blong
24 июня 2014 в 16:15
2

Возможный дубликат: Получить протокол, домен и порт из URL-адреса

Nilesh Botre
20 августа 2015 в 13:34
1

coderhelper.com/questions/406192/…

Ответы (26)

avatar
Peter Mortensen
11 октября 2020 в 06:57
4025

Использование:

window.location.href

Как отмечено в комментариях, строка ниже работает, но для Firefox в ней есть ошибки.

document.URL

См. URL типа DOMString, только чтение .

Telmo Marques
7 июля 2012 в 16:26
149

В Firefox 12 свойство document.URL не обновляется после window.location привязки (#), в то время как window.location.href обновляется. Никаких других версий Firefox я не тестировал. В Chrome 20 и IE9 проблем с использованием document.URL не обнаружено.

Ali U
26 ноября 2012 в 11:59
95

также вы можете получить хост и очистить местоположение: window.location.host и window.location.href.toString().split(window.location.host)[1]

Muhammad Umer
29 августа 2013 в 12:06
9

и что тогда document.baseURI. Обычно есть 3 способа получить URL document.baseURI, document.URL и location.

Roy Tinker
5 декабря 2013 в 00:02
21

-1: Если у вас есть рамка, изображение или форма с name="URL", тогда это свойство будет затенено на объекте document, и ваш код сломается. В этом случае document.URL вместо этого будет ссылаться на узел DOM. Лучше использовать свойства глобального объекта как в window.location.href.

GabrielBB
11 июля 2014 в 12:31
14

"window.location.href" для победы

Gerardo Charles Rojas Vega
29 ноября 2014 в 02:16
0

Это немного сбивает с толку тех, кто ищет правильную информацию (я просто имею в виду, что должно быть редактирование, чтобы отображать window.location.href вместо document.URL в качестве ответа)

Dushman
11 сентября 2017 в 04:27
1

все: - coderhelper.com/questions/6944744/…

Jordan
15 марта 2018 в 22:40
0

Нужно ли при сравнении включать косую черту в конце? Нравится: ..mysite.com/

wranvaud
29 октября 2019 в 14:03
1

@aliyouhannaei, вы также можете сделать window.location.pathname, чтобы получить только путь

APu
29 июня 2020 в 06:48
0

window.location.pathname // выводит: "/ js" (где url - "stacksnippets.net/js")

Timo
12 марта 2021 в 19:36
0

@AliU toString () не требуется, поскольку первый является строкой.

avatar
Weilory
18 декабря 2021 в 08:17
3
let url = new URL(window.location.href);
// http://127.0.0.1:8000/projects/page/member/assign/2/

/*
hash: ""

host: "127.0.0.1:8000"

hostname: "127.0.0.1"

href: "http://127.0.0.1:8000/projects/page/member/assign/2/"

origin: "http://127.0.0.1:8000"

password: ""

pathname: "/projects/page/member/assign/2/"

port: "8000"

protocol: "http:"

search: ""
*/
avatar
Giacomo Casadei
10 февраля 2021 в 10:04
2

Используйте это:

var url = window.location.href;

console.log(url);
avatar
Programmer
1 января 2021 в 11:55
2

У вас есть несколько способов сделать это.

1:

location.href;

2:

document.URL;

3:

document.documentURI;
avatar
Kamil Kiełczewski
1 января 2020 в 22:37
1

Попробуйте

location+''

let url = location+'';

console.log(url);
avatar
Apollo Data
27 декабря 2019 в 17:05
7

Ответ Нихила Агравала великолепен, просто добавьте здесь небольшой пример, который вы можете сделать в консоли, чтобы увидеть различные компоненты в действии:

enter image description here

[ при разработке Django у вас иногда бывает нестандартный порт, который ломает его, если вы просто используете имя хоста и т. д.)

avatar
Seph Reed
29 сентября 2019 в 22:51
7

Для тех, кому нужен реальный объект URL, возможно, для служебной программы, которая принимает URL в качестве аргумента:

const url = new URL(window.location.href)

https://developer.mozilla.org/en-US/docs/Web/API/URL

avatar
Ashish Kamble
9 октября 2018 в 11:52
-2

Сначала проверьте, что страница полностью загружена в

browser,window.location.toString();

window.location.href

затем вызовите функцию, которая принимает URL-адрес, переменную URL-адреса и выводит на консоль

$(window).load(function(){
   var url = window.location.href.toString();
   var URL = document.URL;
   var wayThreeUsingJQuery = $(location).attr('href');
   console.log(url);
   console.log(URL);
   console.log(wayThreeUsingJQuery );
});
avatar
curiosity
30 июня 2018 в 10:26
0

, если вы ссылаетесь на конкретную ссылку с идентификатором id , этот код может вам помочь.

$(".disapprove").click(function(){
    var id = $(this).attr("id");

    $.ajax({
        url: "<?php echo base_url('index.php/sample/page/"+id+"')?>",
        type: "post",
        success:function()
        {
            alert("The Request has been Disapproved");
            window.location.replace("http://localhost/sample/page/"+id+"");
        }
    });
});

Я использую здесь ajax для отправки идентификатора и перенаправления страницы с помощью window.location.replace . просто добавьте атрибут id="", как указано.

avatar
Hasib Kamal
26 декабря 2017 в 04:08
1

Получение текущего URL-адреса с помощью JavaScript:

  • window.location.toString();

  • window.location.href

avatar
Hitesh Sahu
3 ноября 2017 в 13:52
9

Добавление результата для быстрой справки

window.location;

 Location {href: "https://coderhelper.com/questions/1034621/get-the-current-url-with-javascript",
 ancestorOrigins: DOMStringList,
 origin: "https://coderhelper.com",
 replace: ƒ, assign: ƒ, …}

document.location

  Location {href: "https://coderhelper.com/questions/1034621/get-the-current-url-with-javascript", 
ancestorOrigins: DOMStringList,
 origin: "https://coderhelper.com",
 replace: ƒ, assign: ƒ
, …}

window.location.pathname

"/questions/1034621/get-the-current-url-with-javascript"

window.location.href

"https://coderhelper.com/questions/1034621/get-the-current-url-with-javascript"

location.hostname

"coderhelper.com"
avatar
Alireza
7 октября 2017 в 02:31
72

Хорошо, получить полный URL-адрес текущей страницы легко, используя чистый JavaScript. Например, попробуйте этот код на этой странице:

window.location.href;
// use it in the console of this page will return
// http://coderhelper.com/questions/1034621/get-current-url-in-web-browser"

Свойство window.location.href возвращает URL-адрес текущей страницы.

document.getElementById("root").innerHTML = "The full URL of this page is:<br>" + window.location.href;
<!DOCTYPE html>
<html>

<body>
  <h2>JavaScript</h2>
  <h3>The window.location.href</h3>
  <p id="root"></p>
</body>

</html>

Неплохо упомянуть и это:

  • если вам нужен относительный путь, просто используйте window.location.pathname;

  • если вы хотите получить имя хоста, вы можете использовать window.location.hostname;

  • и если вам нужно получить протокол отдельно, используйте window.location.protocol

    • также, если на вашей странице есть тег hash, вы можете получить его так: window.location.hash.

Итак, window.location.href обрабатывает все за один раз ... в основном:

window.location.protocol + '//' + window.location.hostname + window.location.pathname + window.location.hash === window.location.href;
    //true

Также использование window не требуется, если он уже находится в области окна ...

Итак, в этом случае вы можете использовать:

location.protocol

location.hostname

location.pathname

location.hash

location.href

Get the current URL with JavaScript

avatar
tmh
9 июня 2017 в 09:32
42

Откройте Инструменты разработчика , введите в консоли и нажмите Введите .

window.location

Пример: Ниже приведен снимок экрана с результатом на текущей странице.

enter image description here

Возьмите то, что вам нужно здесь. :)

avatar
زياد
6 апреля 2017 в 11:47
3
location.origin+location.pathname+location.search+location.hash;

и

location.href

делает то же самое.

avatar
Khaled Harby
14 марта 2017 в 13:13
2

Вы можете получить полную ссылку на текущую страницу через location.href и чтобы получить ссылку на текущий контроллер, используйте:

location.href.substring(0, location.href.lastIndexOf('/'));
avatar
Bhaskar Bhatt
8 октября 2016 в 15:24
18

Вы можете получить текущее местоположение URL-адреса с помощью хэш-тега, используя:

JavaScript:

 // Using href
 var URL = window.location.href;

 // Using path
 var URL = window.location.pathname;

jQuery :

$(location).attr('href');
avatar
Maleen Abewardana
12 апреля 2016 в 15:06
5

В jstl мы можем получить доступ к текущему пути URL, используя pageContext.request.contextPath. Если вы хотите выполнить вызов Ajax, используйте следующий URL-адрес.

url = "${pageContext.request.contextPath}" + "/controller/path"

Пример: для страницы http://coderhelper.com/posts/36577223 это даст http://coderhelper.com/controller/path.

avatar
Josip Ivic
29 сентября 2015 в 14:05
5

Способ получения текущего объекта местоположения: window.location.

Сравните это с document.location, который изначально возвращал только текущий URL-адрес в виде строки. Вероятно, чтобы избежать путаницы, document.location был заменен на document.URL.

И все современные браузеры отображают document.location на window.location.

На самом деле для кроссбраузерной безопасности вы должны использовать window.location, а не document.location.

avatar
Sangeet Shah
10 сентября 2015 в 06:51
45

Чтобы получить путь, вы можете использовать:

console.log('document.location', document.location.href);
console.log('location.pathname',  window.location.pathname); // Returns path only
console.log('location.href', window.location.href); // Returns full URL
avatar
kishore
26 марта 2015 в 06:10
24
  • Используйте window.location.href, чтобы получить полный URL.
  • Используйте window.location.pathname, чтобы получить URL, покидающий хост.
OMGPOP
29 июня 2015 в 07:53
5

window.location.pathname не включает запрос и хеш-фрагмент

avatar
Syed Nasir Abbas
5 сентября 2014 в 23:07
8

Для полного URL со строками запроса:

document.location.toString()

Для URL-адреса хоста:

window.location
avatar
Dorian
25 апреля 2014 в 16:14
30

Используйте: window.location.href.

Как отмечалось выше, document.URL не обновляет при обновлении window.location. См. MDN.

avatar
Nikhil Agrawal
23 декабря 2013 в 15:33
761

Доступ к информации URL

JavaScript предоставляет вам множество методов для получения и изменения текущего URL-адреса, который отображается в адресной строке браузера. Все эти методы используют объект Location, который является свойством объекта Window. Вы можете создать новый объект Location с текущим URL-адресом следующим образом:

var currentLocation = window.location;

Базовая структура URL

<protocol>//<hostname>:<port>/<pathname><search><hash>
  • протокол: Задает имя протокола, которое будет использоваться для доступа к ресурсу в Интернете. (HTTP (без SSL) или HTTPS (с SSL))

  • имя хоста: Имя хоста указывает хост, которому принадлежит ресурс. Например, www.coderhelper.com. Сервер предоставляет услуги, используя имя хоста.

  • порт: Номер порта, используемый для распознавания определенного процесса, которому должно быть перенаправлено Интернет или другое сетевое сообщение, когда оно поступает на сервер.

  • путь: Путь дает информацию о конкретном ресурсе на хосте, к которому веб-клиент хочет получить доступ. Например, /index.html .

  • .
  • поиск: Строка запроса следует за компонентом пути и предоставляет строку информации, которую ресурс может использовать для некоторых целей (например, как параметры для поиска или как данные, которые будут обработанный).

  • хэш: Якорная часть URL-адреса включает знак решетки (#).

С помощью этих свойств объекта Location вы можете получить доступ ко всем этим компонентам URL и к тому, что они могут устанавливать или возвращать:

  • href - весь URL
  • протокол - протокол URL
  • хост - имя хоста и порт URL
  • hostname - имя хоста URL
  • порт - номер порта, который сервер использует для URL
  • pathname - имя пути URL
  • поиск - часть запроса URL
  • hash - часть привязки URL

Надеюсь, вы получили свой ответ ..

Peter Krauss
22 июля 2014 в 22:18
11

Это не «методы» window.location, а свойства, и здесь у нас есть пример: var stringPathName = window.location.pathname.

FindOut_Quran
23 декабря 2016 в 05:11
1

@FabioC. Вы можете удалить его с помощью substring. Однако это может быть полезно, если вы хотите использовать для перенаправления document.location = "/page.html"; перенаправление на корневую страницу page.html

AJcodez
5 июня 2017 в 14:55
1

Имейте в виду, что ie9 pathname не имеет ведущей косой черты, поэтому это может быть index.html.

Panzercrisis
7 января 2019 в 07:10
4

Это отвечает не только на поставленный вопрос. На самом деле, около месяца назад я искал хороший способ получить одну или несколько конкретных частей из строки URL (я думаю, что это, вероятно, была текущая страница, которую я пытался получить), и хотя другие вопросы были больше -target, их ответы не были такими полезными и простыми для этой цели, как этот.

Panzercrisis
7 января 2019 в 07:11
2

Одно быстрое предложение: в базовой структуре URL, описанной выше, есть место для search, но в приведенном ниже списке описаний оно называется query. Может быть, их можно примирить, или можно добавить дополнительные пояснения.

Apollo Data
27 декабря 2019 в 17:01
2

Это называется "поиск", а не "запрос".

madaimartin
21 октября 2020 в 09:25
1

Ваш ответ очень подробный. Спасибо, что поделились с нами своими знаниями.

Radmation
23 октября 2020 в 19:23
1

Я ценю этот ответ, прямой и точный. Спасибо, что поделился!

avatar
Rohan Patil
19 декабря 2013 в 12:58
11
var currentPageUrlIs = "";
if (typeof this.href != "undefined") {
       currentPageUrlIs = this.href.toString().toLowerCase(); 
}else{ 
       currentPageUrlIs = document.location.toString().toLowerCase();
}

Приведенный выше код также может помочь кому-то

AnthonyVO
15 мая 2015 в 23:33
2

Вы применили .toLowerCase () к URL-адресу, который фактически его меняет. Некоторые серверы чувствительны к регистру (Linux и т. Д.)

deadboy
29 мая 2015 в 16:01
0

Вы должны подробно использовать window.href. Этот код работает только в контексте этого окна ===, однако это может быть не всегда, особенно если кто-то вставил это решение.

mivk
11 июня 2015 в 17:47
0

Это не "некоторые" серверы, которые чувствительны к регистру. Это БОЛЬШИНСТВО серверов. Так что я согласен с AnthonyVO: менять регистр URL - очень плохая идея.

FrancescoMM
9 сентября 2016 в 07:03
0

Вы не можете toLowerCase () URL, чтобы не нарушить его !!! Если URL-адрес http://www.server.com/path/to/Script.php?option=A1B2C3, если файловая система чувствительна к регистру (Linux / Unix), не обязательно, чтобы Script.php и script.php были одинаковыми. И даже если он не чувствителен к регистру (Windows, некоторые Mac OS), ?option=A1B2C3 не совпадает с ?option=a1b2c3 или даже ?Option=A1B2C3. Только сервер нечувствителен к регистру: www.server.com или www.SeRvEr.cOm - это одно и то же.

avatar
Christoph
23 июня 2009 в 19:35
331

Используйте window.location для чтения и записи доступа к объекту местоположения, связанному с текущим кадром. Если вы просто хотите получить адрес в виде строки, доступной только для чтения, вы можете использовать document.URL, который должен содержать то же значение, что и window.location.href.

Christoph
12 марта 2010 в 09:06
19

см. также coderhelper.com/questions/2430936/…

avatar
Zanoni
23 июня 2009 в 19:28
273

Получает URL-адрес текущей страницы:

window.location.href
Gumbo
23 июня 2009 в 19:32
3

Обратите внимание, что это расположение окна, а не документа.

Zanoni
23 июня 2009 в 19:34
16

Это то же самое. Полный текущий URL относится к пути к документу (внешнему адресу).

chendral
23 июня 2009 в 19:47
2

Он стандартизирован, как document.url? (Я имею в виду что-то вроде документа w3c)

broinjc
19 сентября 2014 в 16:19
0

document - корень дерева документа, определенного в спецификации. window обычно эквивалентен, но может и не быть в некоторых странных обстоятельствах.