web-dev-qa-db-fra.com

Obtenir l'URL actuelle avec jQuery?

J'utilise jQuery. Comment puis-je obtenir le chemin de l'URL actuelle et l'assigner à une variable?

Exemple d'URL:

http://localhost/menuname.de?foo=bar&number=0
javascriptjqueryurlpath
1727
venkatachalam

Pour obtenir le chemin, vous pouvez utiliser:

var pathname = window.location.pathname; // Returns path only (/path/example.html)
var url      = window.location.href;     // Returns full URL (https://example.com/path/example.html)
var Origin   = window.location.Origin;   // Returns base URL (https://example.com)
2358
Ryan Doherty

En pur style jQuery:

$(location).attr('href');

L'objet location a également d'autres propriétés, telles que hôte, hachage, protocole et chemin d'accès.

803
Boris Guéry
http://www.refulz.com:8082/index.php#tab2?foo=789

Property    Result
------------------------------------------
Host        www.refulz.com:8082
hostname    www.refulz.com
port        8082
protocol    http:
pathname    index.php
href        http://www.refulz.com:8082/index.php#tab2
hash        #tab2
search      ?foo=789

var x = $(location).attr('<property>');

Cela ne fonctionnera que si vous avez jQuery. Par exemple:

<html>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<script>
  $(location).attr('href');      // http://www.refulz.com:8082/index.php#tab2
  $(location).attr('pathname');  // index.php
</script>
</html>
454
rizon

Si vous avez besoin des paramètres de hachage présents dans l'URL, window.location.href peut être un meilleur choix.

window.location.pathname
=> /search

window.location.href 
 => www.website.com/search#race_type=1
64
jlfenaux

Vous voudrez utiliser l'objet window.location intégré de JavaScript.

52
clawr

Il suffit d’ajouter cette fonction en JavaScript, qui renvoie le chemin absolu du chemin actuel.

function getAbsolutePath() {
    var loc = window.location;
    var pathName = loc.pathname.substring(0, loc.pathname.lastIndexOf('/') + 1);
    return loc.href.substring(0, loc.href.length - ((loc.pathname + loc.search + loc.hash).length - pathName.length));
}

J'espère que cela fonctionne pour vous.

44
Neville Bonavia

window.location est un objet en javascript. il renvoie les données suivantes

window.location.Host          #returns Host
window.location.hostname      #returns hostname
window.location.path          #return path
window.location.href          #returns full current url
window.location.port          #returns the port
window.location.protocol      #returns the protocol

dans jQuery vous pouvez utiliser

$(location).attr('Host');        #returns Host
$(location).attr('hostname');    #returns hostname
$(location).attr('path');        #returns path
$(location).attr('href');        #returns href
$(location).attr('port');        #returns port
$(location).attr('protocol');    #returns protocol
34
Gaurav

C'est une question plus compliquée que beaucoup ne le pensent. Plusieurs navigateurs prennent en charge les objets d'emplacement JavaScript intégrés et les paramètres/méthodes associés accessibles via window.location ou document.location. Cependant, différentes versions d'Internet Explorer (6,7) ne prennent pas en charge ces méthodes de la même manière (window.location.href? window.location.replace() n'est pas prise en charge). Vous devez donc y accéder différemment en écrivant du code conditionnel all. le temps de tenir Internet Explorer.

Ainsi, si jQuery est disponible et chargé, vous pouvez également utiliser jQuery (emplacement), comme indiqué par les autres, car cela résout ces problèmes. Si, toutefois, vous faites un exemple de redirection de géolocalisation côté client via JavaScript (à l'aide de l'API Google Maps et des méthodes d'objet d'emplacement), vous pouvez ne pas vouloir charger la totalité de la bibliothèque jQuery et écrire votre code conditionnel. vérifie chaque version d'Internet Explorer/Firefox/etc.

Internet Explorer rend le chat codeur frontal malheureux, mais jQuery est une assiette de lait.

29
negutron

Pour le nom d'hôte uniquement, utilisez:

window.location.hostname
27
Mahmoud Farahat

Cela fonctionnera également:

var currentURL = window.location.href;
22
Suresh Pattu

Java-script fournit de nombreuses méthodes pour récupérer l'URL actuelle qui est affichée dans la barre d'adresse du navigateur.

URL de test:

_http://
stackoverflow.com/questions/5515310/get-current-url-with-jquery/32942762
?
rq=1&page=2&tab=active&answertab=votes
#
32942762
_
_resourceAddress.hash();
console.log('URL Object ', webAddress);
console.log('Parameters ', param_values);
_

Fonction: 

_var webAddress = {};
var param_values = {};
var protocol = '';
var resourceAddress = {

    fullAddress : function () {
        var addressBar = window.location.href;
        if ( addressBar != '' && addressBar != 'undefined') {
            webAddress[ 'href' ] = addressBar;
        }
    },
    protocol_identifier : function () { resourceAddress.fullAddress();

        protocol = window.location.protocol.replace(':', '');
        if ( protocol != '' && protocol != 'undefined') {
            webAddress[ 'protocol' ] = protocol;
        }
    },
    domain : function () {      resourceAddress.protocol_identifier();

        var domain = window.location.hostname;
        if ( domain != '' && domain != 'undefined' && typeOfVar(domain) === 'string') {
            webAddress[ 'domain' ] = domain;
            var port = window.location.port;
            if ( (port == '' || port == 'undefined') && typeOfVar(port) === 'string') {
                if(protocol == 'http') port = '80';
                if(protocol == 'https') port = '443';           
            }
            webAddress[ 'port' ] = port;
        }
    },
    pathname : function () {        resourceAddress.domain();

        var resourcePath = window.location.pathname;
        if ( resourcePath != '' && resourcePath != 'undefined') {
            webAddress[ 'resourcePath' ] = resourcePath;
        }
    },
    params : function () {      resourceAddress.pathname();

        var v_args = location.search.substring(1).split("&");

        if ( v_args != '' && v_args != 'undefined')
        for (var i = 0; i < v_args.length; i++) {
            var pair = v_args[i].split("=");

            if ( typeOfVar( pair ) === 'array' ) {
                param_values[ decodeURIComponent( pair[0] ) ] = decodeURIComponent( pair[1] );
            }
        }
        webAddress[ 'params' ] = param_values;
    },
    hash : function () {        resourceAddress.params();

        var fragment = window.location.hash.substring(1);
        if ( fragment != '' && fragment != 'undefined')
            webAddress[ 'hash' ] = fragment;        
    }
};
function typeOfVar (obj) {
      return {}.toString.call(obj).split(' ')[1].slice(0, -1).toLowerCase();
}
_
  • protocole " navigateurs Web utilise le protocole Internet en respectant certaines règles de communication entre les applications Web hébergées et le client Web (navigateur). (http = 8 , https (SSL) = 44 , ftp = 21, etc.)

EX: avec les numéros de port par défaut

_<protocol>//<hostname>:<port>/<pathname><search><hash>
https://en.wikipedia.org:443/wiki/Pretty_Good_Privacy
http://stackoverflow.com:80/
_
  • (//) "Host est le nom donné à un noeud final (machine sur laquelle la ressource vit) sur Internet. www.stackoverflow.com - DNS Adresse IP d'un hôte d'application (OR) localhost: 8080 - localhost

Les noms de domaine sont ceux que vous enregistrez conformément aux règles et procédures de l'arborescence DNS (Domain Name System). Les serveurs DNS de quelqu'un qui gère votre domaine avec une adresse IP à des fins d'adressage. Dans la hiérarchie du serveur DNS, le nom racine d'un stackoverlfow.com est com.

_gTLDs      - com « stackoverflow (OR) in « co « google
_

Système local, vous devez gérer les domaines qui ne sont pas PUBLIC dans les fichiers hôtes. _localhost.yash.com « localhsot - subdomain(_ web-server _), yash.com - maindomain(_ Proxy-Server _). myLocalApplication.com 172.89.23.777_

  • (/) "Le chemin donne des informations sur la ressource spécifique de l'hôte à laquelle le client Web veut accéder.
  • (?) "Une requête facultative consiste à transmettre une séquence de paires attribut-valeur séparées par un délimiteur (&).
  • (#) "Un fragment optionnel est souvent l'attribut id d'un élément spécifique, et les navigateurs web la feront défiler.

Si le paramètre a un Epoch _?date=1467708674_, utilisez-le.

_var epochDate = 1467708674; var date = new Date( epochDate );
_

URL enter image description here

URL d'authentification avec nom d'utilisateur: mot de passe, Si nom d'utilisateur/mot de passe contient @ symbole
comme:

_Username = `my_email@gmail`
Password = `Yash@777`
_

alors vous devez URL encoder le @ comme %40. voir ...

_http://my_email%40gmail.com:Yash%[email protected]_site.com
_

encodeURI() (vs) encodeURIComponent() exemple

_var testURL = "http:my_email@gmail:Yash777@//stackoverflow.com?tab=active&page=1#32942762";

var Uri = "/:@?&=,#", UriComponent = "$;+", Unescaped = "(-_.!~*')"; // Fixed
var encodeURI_Str = encodeURI(Uri) +' '+ encodeURI( UriComponent ) +' '+ encodeURI(Unescaped);
var encodeURIComponent_Str =  encodeURIComponent( Uri ) +' '+ encodeURIComponent( UriComponent ) +' '+ encodeURIComponent( Unescaped );
console.log(encodeURI_Str, '\n', encodeURIComponent_Str);
/*
 /:@?&=,# +$; (-_.!~*') 
 %2F%3A%40%3F%26%3D%2C%23 %2B%24%3B (-_.!~*')
*/
_
21
Yash

Vous pouvez vous connecter à window.location et voir toutes les options, pour utiliser uniquement l'URL:

window.location.Origin

pour tout le chemin, utilisez:

window.location.href

il y a aussi l'emplacement ._ _

.Host
.hostname
.protocol
.pathname
19
dacopenhagen

Cela retournera l'absolu URL de la page en cours en utilisant JavaScript/ jQuery .

  • document.URL

  • $("*").context.baseURI

  • location.href

15
user1570636

Si quelqu'un souhaite concaténer la balise URL et hash, combinez deux fonctions:

var pathname = window.location.pathname + document.location.hash;
13
Nis

Vous pouvez simplement obtenir votre chemin en utilisant js lui-même, window.location ou location vous donnera l'objet de l'URL actuelle

console.log("Origin - ",location.Origin);
console.log("Entire URL - ",location.href);
console.log("Path Beyond URL - ",location.pathname);
12
Mohideen bin Mohammed

J'ai ceci pour éliminer les variables GET.

var loc = window.location;
var currentURL = loc.protocol + '//' + loc.Host + loc.pathname;
12
Aram Kocharyan

Voici un exemple pour obtenir l'URL actuelle à l'aide de jQuery et JavaScript:

$(document).ready(function() {

    //jQuery
    $(location).attr('href');

    //Pure JavaScript
    var pathname = window.location.pathname;

    // To show it in an alert window
    alert(window.location);
});


$.getJSON("idcheck.php?callback=?", { url:$(location).attr('href')}, function(json){
    //alert(json.message);
});
11
user3580413

Pour obtenir l'URL de la fenêtre parente à partir d'une iframe:

$(window.parent.location).attr('href');

NB: ne fonctionne que sur le même domaine

11
Costa
 var currenturl = jQuery(location).attr('href');
11
hari maliya

Vous trouverez ci-après des exemples d'extraits de code utiles pouvant être utilisés. Certains exemples utilisent des fonctions JavaScript standard et ne sont pas spécifiques à jQuery:

Voir 8 extraits de code jQuery utiles pour les chaînes d’URL et les chaînes de chaîne de caractères.

10
Issamovitch

Utilisez window.location.href . Cela vous donnera le complet URL .

10
Saikumar Anireddy

window.location vous donnera le courant URL , et vous pouvez en extraire ce que vous voulez ...

9
ZMR BINU

Si vous voulez obtenir le chemin du site racine, utilisez ceci:

$(location).attr('href').replace($(location).attr('pathname'),'');
8
vikas mehta

Voir purl.js . Cela aidera vraiment et peut également être utilisé, selon jQuery. Utilisez-le comme ceci:

$.url().param("yourparam");
8
Chuanshi Liu

var path = location.pathname renvoie le chemin de l'URL actuelle (jQuery n'est pas nécessaire). L'utilisation de window.location est facultative.

8
Jonathan Lin

Très couramment utilisé top 3 ceux sont

1. window.location.hostname 
2. window.location.href
3. window.location.pathname
7
Nitish Kumar Pal

Tous les navigateurs supportent les objets fenêtre Javascript. Il définit la fenêtre du navigateur.

Les objets globaux et les fonctions font automatiquement partie de l'objet window.

Toutes les variables globales sont des propriétés d'objets de fenêtre et toutes les fonctions globales sont ses méthodes.

L'ensemble du document HTML est également une propriété de fenêtre.

Vous pouvez donc utiliser l'objet window.location pour obtenir tous les attributs liés à l'URL.

Javascript

console.log(window.location.Host);     //returns Host
console.log(window.location.hostname);    //returns hostname
console.log(window.location.pathname);         //return path
console.log(window.location.href);       //returns full current url
console.log(window.location.port);         //returns the port
console.log(window.location.protocol)     //returns the protocol

JQuery

console.log("Host = "+$(location).attr('Host'));
console.log("hostname = "+$(location).attr('hostname'));
console.log("pathname = "+$(location).attr('pathname')); 
console.log("href = "+$(location).attr('href'));   
console.log("port = "+$(location).attr('port'));   
console.log("protocol = "+$(location).attr('protocol'));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
7
Sumesh TG
var newURL = window.location.protocol + "//" + window.location.Host + "/" + window.location.pathname;
6
Hema Ganapathy
// get current URL

$(location).attr('href');
var pathname = window.location.pathname;
alert(window.location);
5
Ayan Chakraborty

En jstl, nous pouvons accéder au chemin d’URL actuel en utilisant pageContext.request.contextPath, Si vous voulez faire un appel ajax,

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

Ex: dans la page http://stackoverflow.com/questions/406192 cela donnera http://stackoverflow.com/controller/path

4
Maleen Abewardana