JavaScript - получить часть пути URL

Ответ 1

Существует свойство встроенного объекта window.location, который предоставит это для текущего окна.

// If URL is http://www.somedomain.com/account/search?filter=a#top

window.location.pathname // /account/search

// For reference:

window.location.host     // www.somedomain.com (includes port if there is one)
window.location.hostname // www.somedomain.com
window.location.hash     // #top
window.location.href     // http://www.somedomain.com/account/search?filter=a#top
window.location.port     // (empty string)
window.location.protocol // http:
window.location.search   // ?filter=a  

Обновить, используйте те же свойства для любого URL:

Оказывается, эта схема стандартизируется как интерфейс URLUtils и угадайте, что? И существующий объект window.location , и элементы привязки реализуют интерфейс.

Таким образом, вы можете использовать те же свойства выше для любого URL — просто создайте привязку с URL-адресом и получите доступ к свойствам:

var el = document.createElement('a');
el.href = "http://www.somedomain.com/account/search?filter=a#top";

el.host        // www.somedomain.com (includes port if there is one[1])
el.hostname    // www.somedomain.com
el.hash        // #top
el.href        // http://www.somedomain.com/account/search?filter=a#top
el.pathname    // /account/search
el.port        // (port if there is one[1])
el.protocol    // http:
el.search      // ?filter=a

[1]: Поддержка браузера для свойств, содержащих порт, несовместима, см. http://jessepollak.me/chrome-was-wrong-ie-was-right

Это работает в последних версиях Chrome и Firefox. У меня нет версий Internet Explorer для тестирования, поэтому, пожалуйста, проверьте себя на примере JSFiddle.

Пример JSFiddle

Там также появится объект URL, который будет предлагать эту поддержку для самих URL, без элемента привязки. Похоже, что стабильные браузеры не поддерживают его в это время, но говорят, что он входит в Firefox 26. Когда вы думаете, что у вас может быть поддержка, попробуйте здесь.

Ответ 2

window.location.href.split('/');

Дает вам массив, содержащий все части URL, к которым вы можете получить доступ, как обычный массив.

Или все более элегантное решение, предложенное @Dylan, с только части пути:

window.location.pathname.split('/');

Ответ 3

Если это текущий URL-адрес, используйте window.location.pathname, в противном случае используйте это регулярное выражение:

var reg = /.+?\:\/\/.+?(\/.+?)(?:#|\?|$)/;
var pathname = reg.exec( 'http://www.somedomain.com/account/search?filter=a#top' )[1];

Ответ 4

Другие ответы на все используют document.createElement или window.location, которые не поддерживаются в таких средах, как node, поэтому я написал component, который будет работать как со стороны сервера javascript, так и в браузерах.

Вы можете использовать parseUrl(), чтобы получить объект, похожий на тот, который был получен от ответа Nicole:

var url = 'http://www.somedomain.com/account/search?filter=a#top';
var urlObject = parseUrl(url);

urlObject.href         // 'http://www.somedomain.com/account/search?filter=a#top'
urlObject.searchParams // { filter: 'a' }
urlObject.hash         // '#top'
urlObject.search       // '?filter=a'
urlObject.protocol     // 'http:'
urlObject.host         // 'www.somedomain.com'
urlObject.hostname     // 'www.somedomain.com'
urlObject.port.        // ''
urlObject.path         // '/account/search'

Не забудьте импортировать компонент для использования метода parseUrl().