JavaScript – Obtenez une partie de chemin d'URL

Quelle est la manière correcte de retirer le chemin d'une URL à l'aide de JavaScript?

Exemple:
J'ai une URL
Http://www.somedomain.com/account/search?filter=a#top
Mais j'aimerais simplement obtenir cette partie
/ Compte / recherche

J'utilise jQuery s'il y a quelque chose qui puisse être exploité.

Il existe une propriété de l'objet intégré window.location qui fournira la fenêtre actuelle.

 // 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 


Mise à jour, utilisez les mêmes propriétés pour n'importe quelle URL:

Il s'avère que ce schéma est normalisé comme une interface appelée URLUtils , et devinez quoi? Les éléments existants window.location et les éléments d'ancrage implémentent l'interface.

Vous pouvez donc utiliser les mêmes propriétés ci-dessus pour toute URL : créez simplement une ancre avec l'URL et accédez aux propriétés:

 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]: Le support du navigateur pour les propriétés qui incluent le port n'est pas cohérent, voir: http://jessepollak.me/chrome-was-wrong-ie-was-right

Cela fonctionne dans les dernières versions de Chrome et Firefox . Je n'ai pas de versions d'Internet Explorer pour tester, alors testez-vous avec l'exemple JSF.

JSFiddle exemple

Il existe également un URL objet URL qui offrira ce support aux URL eux-mêmes, sans l'élément d'ancrage. On dirait qu'aucun navigateur stable ne l' accueille pour le moment, mais on dit que cela se produira dans Firefox 26. Lorsque vous pensez que vous pourriez avoir un support, essayez-le ici .

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

Vous donnera un tableau contenant toutes vos pièces url, auxquelles vous pouvez accéder comme un tableau normal.

S'il s'agit de la fenêtre d'utilisation d'url actuelle.location.pathname, utilisez cette expression régulière:

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

Les autres réponses utilisent tous document.createElement ou window.location qui ne sont pas pris en charge dans des environnements comme le nœud, donc j'ai écrit un composant qui fonctionnera avec le javascript côté serveur ainsi que dans les navigateurs.

Vous pouvez utiliser parseUrl () pour obtenir un objet similaire à celui de la réponse de 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' 

N'hésitez pas à importer le composant pour utiliser la méthode parseUrl ().