जावास्क्रिप्ट के साथ वर्तमान URL प्राप्त करें?


3002

मैं बस इतना चाहता हूं कि वेबसाइट URL प्राप्त कर ले। लिंक से लिया गया URL नहीं है। पृष्ठ लोड होने पर मुझे वेबसाइट के पूर्ण, वर्तमान URL को हथियाने में सक्षम होना चाहिए और इसे एक चर के रूप में सेट करना होगा जैसा मैं चाहता हूं।



जवाबों:


3680

उपयोग:

window.location.href 

जैसा कि टिप्पणियों में उल्लेख किया गया है, नीचे की रेखा काम करती है, लेकिन यह फ़ायरफ़ॉक्स के लिए खराब है।

document.URL;

DOMString का URL देखें , आसानी से


142
फ़ायरफ़ॉक्स 12 में document.URLसंपत्ति window.locationएंकर (#) के बाद अपडेट नहीं होती है , जबकि window.location.hrefकरता है। मैंने यहां एक लाइव डेमो एक साथ रखा है: jsfiddle.net/PxgKy मैंने फ़ायरफ़ॉक्स के किसी भी अन्य संस्करण का परीक्षण नहीं किया। document.URLChrome 20 और IE9 में उपयोग करने का कोई मुद्दा नहीं मिला।
टेलमो Marques

88
भी आप मेजबान और स्पष्ट स्थान प्राप्त कर सकते हैं: window.location.hostऔरwindow.location.href.toString().split(window.location.host)[1]
अली youhannaei

8
और document.baseURIउसके बाद क्या है असल में वहाँ यूआरएल पाने के लिए 3 तरीके हैं document.baseURI, document.URL, और location
मुहम्मद उमर

20
-1: यदि आपके पास एक फ्रेम, इमेज या फॉर्म है, name="URL"तो यह प्रॉपर्टी documentऑब्जेक्ट पर छाया रहेगा और आपका कोड टूट जाएगा। उस स्थिति में, document.URLइसके बजाय DOM नोड को संदर्भित करेगा। में वैश्विक वस्तु के गुणों का उपयोग करने के लिए बेहतर है window.location.href
रॉय टिंकर

13
जीत के लिए "window.location.href"
गेब्रियलबी

663

URL जानकारी पहुँच

जावास्क्रिप्ट आपको वर्तमान यूआरएल को पुनः प्राप्त करने और बदलने के लिए कई तरीके प्रदान करता है, जो ब्राउज़र के पता बार में प्रदर्शित होता है। इन सभी तरीकों से Locationऑब्जेक्ट का उपयोग होता है, जो ऑब्जेक्ट की एक संपत्ति है Window। आप एक नया Locationऑब्जेक्ट बना सकते हैं जिसमें वर्तमान URL निम्नानुसार है:

var currentLocation = window.location;

मूल URL संरचना

<protocol>//<hostname>:<port>/<pathname><search><hash>
  • प्रोटोकॉल: प्रोटोकॉल नाम निर्दिष्ट करता है जिसका उपयोग इंटरनेट पर संसाधन तक पहुंचने के लिए किया जाता है। (HTTP (SSL के बिना) या HTTPS (SSL के साथ))

  • hostname: होस्ट नाम संसाधन को होस्ट करने वाले होस्ट को निर्दिष्ट करता है। उदाहरण के लिए, www.stackoverflow.com। एक सर्वर होस्ट के नाम का उपयोग करके सेवाएं प्रदान करता है।

  • पोर्ट: किसी विशिष्ट प्रक्रिया को पहचानने के लिए उपयोग किया जाने वाला पोर्ट नंबर जिसमें किसी सर्वर पर एक इंटरनेट या अन्य नेटवर्क संदेश आता है।

  • pathname: पथ होस्ट के भीतर विशिष्ट संसाधन के बारे में जानकारी देता है जिसे वेब क्लाइंट एक्सेस करना चाहता है। उदाहरण के लिए, /index.html

  • खोज: एक क्वेरी स्ट्रिंग पथ घटक का अनुसरण करता है, और एक ऐसी जानकारी प्रदान करता है जिसे संसाधन किसी उद्देश्य के लिए उपयोग कर सकता है (उदाहरण के लिए, खोज के लिए पैरामीटर या संसाधित किए जाने वाले डेटा के रूप में)।

  • हैश: किसी URL का एंकर भाग, हैश साइन (#) शामिल करता है।

इन Locationऑब्जेक्ट गुणों के साथ आप इन सभी URL घटकों तक पहुँच सकते हैं और वे जो सेट या वापस कर सकते हैं:

  • href - संपूर्ण URL
  • प्रोटोकॉल - URL का प्रोटोकॉल
  • होस्ट - URL का होस्टनाम और पोर्ट
  • hostname - URL का hostname
  • port - URL के लिए सर्वर जिस पोर्ट नंबर का उपयोग करता है
  • pathname - URL का पथ नाम
  • खोज - URL का क्वेरी भाग
  • हैश - URL का एंकर भाग

मुझे उम्मीद है कि आपको अपना जवाब मिल गया होगा ।।


7
वे का "तरीकों" नहीं कर रहे हैं window.location, लेकिन गुण, और यहाँ हम एक उदाहरण है : var stringPathName = window.location.pathname
पीटर क्रूस

@FabioC। आप इसे हटा सकते हैं substring। हालाँकि, यह तब उपयोगी हो सकता है जब आप document.location = "/page.html";मूल पृष्ठ पर रीडायरेक्ट करने के लिए उपयोग करना चाहते हैंpage.html
FindOut_Quran

1
यह केवल पूछे गए प्रश्न से अधिक उत्तर देता है। वास्तव में, मैंने URL स्ट्रिंग से एक या अधिक विशिष्ट भागों को प्राप्त करने के अच्छे तरीके के लिए संभवतः लगभग एक महीने पहले खोजा था (मुझे लगता है कि यह संभवतः वह वर्तमान पृष्ठ था जिसे मैं प्राप्त करने की कोशिश कर रहा था), और भले ही अन्य प्रश्न अधिक थे -टार्गेट, उनके उत्तर इस उद्देश्य के लिए उतने उपयोगी और सरल नहीं थे जितना कि यह।
पनजेरसिस

1
एक त्वरित सुझाव हालांकि: ऊपर वर्णित मूल URL संरचना में, इसके लिए एक स्थान है search, लेकिन नीचे दिए गए विवरणों की सूची में, इसे ए कहा जाता है query। शायद या तो उन्हें समेटा जा सकता है, या आगे की व्याख्या को जोड़ा जा सकता है।
पैंजरक्रिसिस

1
इसे 'खोज' नहीं 'क्वेरी' कहा जाता है
अपोलो डेटा

320

वर्तमान फ्रेम से जुड़े स्थान ऑब्जेक्टwindow.location तक पढ़ने और लिखने के लिए उपयोग करें । यदि आप पते को केवल-पढ़ने के लिए स्ट्रिंग के रूप में प्राप्त करना चाहते हैं, तो आप उपयोग कर सकते हैं , जिसमें समान मान होना चाहिए ।document.URLwindow.location.href



264

वर्तमान पृष्ठ URL प्राप्त करता है:

window.location.href

3
ध्यान दें कि यह विंडो का स्थान है, दस्तावेज़ का नहीं।
गम्बू

16
एक ही बात है। पूर्ण वर्तमान URL दस्तावेज़ पथ (बाहरी पता) को संदर्भित करता है।
ज़ानोनी

2
क्या यह document.url की तरह मानकीकृत है? (मैं एक w3c दस्तावेज़ की तरह कुछ मतलब है)
20

documentकल्पना द्वारा परिभाषित दस्तावेज़ पेड़ की जड़ है। windowआम तौर पर समतुल्य है, लेकिन यह कुछ अजीब परिस्थितियों में नहीं हो सकता है।
ब्रिंजजक

57

ठीक है, वर्तमान पृष्ठ का पूर्ण URL प्राप्त करना शुद्ध जावास्क्रिप्ट का उपयोग करना आसान है। उदाहरण के लिए, इस पृष्ठ पर इस कोड को आज़माएं:

window.location.href;
// use it in the console of this page will return
// http://stackoverflow.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

जावास्क्रिप्ट के साथ वर्तमान URL प्राप्त करें


window.location.protocol + '//' + window.location.hostname + window.location.pathname + window.location.hash === window.location.href; हमेशा सच नहीं होता है! window.location.pathname जीईटी मापदंडों को याद कर रहा है।
AssassiN

40

पथ प्राप्त करने के लिए, आप इसका उपयोग कर सकते हैं:

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


35

डेवलपर टूल खोलें , कंसोल में निम्नलिखित टाइप करें और एंटर दबाएं

window.location

Ex: नीचे वर्तमान पृष्ठ पर परिणाम का स्क्रीनशॉट है।

यहां छवि विवरण दर्ज करें

यहां से आपको जो कुछ भी चाहिए, उसे पकड़ो। :)


29

का उपयोग करें: window.location.href

जैसा कि ऊपर उल्लेख किया गया है, document.URL अपडेट करते समय अपडेट नहीं करता हैwindow.locationMDN देखें ।


21
  • window.location.hrefपूर्ण URL प्राप्त करने के लिए उपयोग करें ।
  • window.location.pathnameहोस्ट छोड़ने के लिए URL प्राप्त करने के लिए उपयोग करें ।

4
window.location.pathname में क्वेरी और हैश टुकड़ा शामिल नहीं है
OMGPOP


10
var currentPageUrlIs = "";
if (typeof this.href != "undefined") {
       currentPageUrlIs = this.href.toString().toLowerCase(); 
}else{ 
       currentPageUrlIs = document.location.toString().toLowerCase();
}

उपरोक्त कोड भी किसी की मदद कर सकता है


2
आपने url पर .toLowerCase () लागू किया है जो वास्तव में इसे बदलता है। कुछ सर्वर केस संवेदी होते हैं, (linux, etc ...)
एंथनीवो

आपको विंडो का उपयोग करना चाहिए। यह कोड केवल एक संदर्भ में काम करता है जहां यह === विंडो है, हालांकि यह हमेशा मामला नहीं हो सकता है, खासकर यदि कोई व्यक्ति इस समाधान को चिपकाता है।
डेडबॉय

यह "कुछ" सर्वर नहीं हैं जो केस-संवेदी हैं। यह सबसे सर्वर है। इसलिए मैं एंथनीवीओ से सहमत हूं: यूआरएल के मामले को बदलना बहुत बुरा विचार है।
m बजे

आप tolowerCase () नहीं कर सकते एक URL यकीन है कि इसे तोड़ने के लिए नहीं !!! यदि url है http://www.server.com/path/to/Script.php?option=A1B2C3, यदि फ़ाइल सिस्टम संवेदनशील है (Linux / Unix) जरूरी नहीं है। Script.php और script.php समान हैं। और यहां तक ​​कि अगर मामला संवेदनशील नहीं है (विंडोज, कुछ मैक ओएस) , या ?option=A1B2C3समान ?option=a1b2c3भी नहीं है ?Option=A1B2C3। केवल सर्वर असंवेदनशील है: www.server.com या www.SeRvEr.cOm समान हैं।
फ्रांसेस्कोएम

8

त्वरित संदर्भ के लिए परिणाम जोड़ना

विंडो स्थान;

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

document.location

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

window.location.pathname

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

window.location.href

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

location.hostname

"stackoverflow.com"

7

क्वेरी स्ट्रिंग के साथ पूरा URL:

document.location.toString().toLowerCase();

होस्ट URL के लिए:

window.location

11
आपने url पर .toLowerCase () लागू किया है जो वास्तव में इसे बदलता है। कुछ सर्वर केस सेंसिटिव होते हैं, (linux, etc ...)
एंथनीवो

जैसा कि कहा गया है, आप एक URL को लाइक नहीं कर सकते () यह सुनिश्चित करने के लिए कि उसे तोड़ना नहीं है !!! यदि url server.com/path/to/Script.php?option=A1B2C3 है , यदि फाइल सिस्टम संवेदनशील है (Linux / Unix) जरूरी नहीं तो Script.php और script.php समान हैं। और संवेदनशील नहीं होने पर भी (Windows, कुछ Mac Os)? विकल्प = A1B2C3 समान नहीं है? विकल्प = a1b2c3, या सम? विकल्प = A1B2C3? केवल सर्वर असंवेदनशील है: www.server.com या www.SeRvEr.cOm समान हैं।
फ्रांसेस्कोएम

इस ओर इशारा करने के लिए एंथनीवो आपको धन्यवाद। हम पूरा URL प्राप्त करने के लिए केवल document.location.toString () का उपयोग कर सकते हैं। toLowerCase () को आपकी स्क्रिप्ट में indexOf की तुलना करना था।
सैयद नासिर अब्बास

4

Jstl में हम वर्तमान URL पथ का उपयोग कर सकते हैं pageContext.request.contextPath। यदि आप अजाक्स कॉल करना चाहते हैं, तो निम्न URL का उपयोग करें।

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

उदाहरण: पृष्ठ के लिए http://stackoverflow.com/posts/36577223यह दे देगा http://stackoverflow.com/controller/path


4

वर्तमान स्थान ऑब्जेक्ट प्राप्त करने का तरीका है window.location

इसकी तुलना करें document.location, जो मूल रूप से वर्तमान URL को एक स्ट्रिंग के रूप में लौटाता है। संभवतः भ्रम से बचने के लिए, के document.locationसाथ प्रतिस्थापित किया गया था document.URL

और, सभी आधुनिक ब्राउज़र मैप document.locationकरते हैं window.location

वास्तव में, क्रॉस-ब्राउज़र सुरक्षा के लिए, आपको इसके window.locationबजाय उपयोग करना चाहिए document.location



3

निखिल अग्रवाल का जवाब बहुत अच्छा है, बस थोड़ा सा उदाहरण यहाँ जोड़कर आप कंसोल में कार्रवाई के विभिन्न घटकों को देख सकते हैं:

यहां छवि विवरण दर्ज करें

यदि आप पथ URL या क्वेरी पैरामीटर के बिना आधार URL चाहते हैं (उदाहरण के लिए AJAX अनुरोधों को दोनों विकास / मंचन और उत्पादन सर्वर पर काम करने के लिए), तो window.location.originयह सबसे अच्छा है क्योंकि यह प्रोटोकॉल के साथ-साथ वैकल्पिक पोर्ट (Django विकास में, आप कभी-कभी रखता है ) एक गैर-मानक पोर्ट है जो इसे तोड़ता है यदि आप केवल होस्टनाम आदि का उपयोग करते हैं)



0

आप वर्तमान पृष्ठ का पूरा लिंक location.href वर्तमान नियंत्रक के लिंक के माध्यम से प्राप्त कर सकते हैं, उपयोग कर सकते हैं:

location.href.substring(0, location.href.lastIndexOf('/'));

0

जावास्क्रिप्ट के साथ वर्तमान URL प्राप्त करना:

  • window.location.toString ();

  • window.location.href


0

यदि आप एक विशिष्ट लिंक का उल्लेख कर रहे हैं जिसमें एक आईडी है तो यह कोड आपकी मदद कर सकता है।

$(".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+"");
        }
    });
});

मैं यहाँ एक id जमा करने के लिए ajax का उपयोग कर रहा हूँ और window.location.replace का उपयोग करके पृष्ठ को पुनर्निर्देशित कर रहा हूँ । id=""जैसा कि कहा गया है केवल एक विशेषता जोड़ें ।



-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 );
});
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.