If tutorials available on this website are helpful for you, please whitelist this website in your ad blocker😭 or Donate to help us ❤️ pay for the web hosting to keep the website running.
JavaScript में location Object, Current URL Info provide करता है , इसके साथ साथ redirection , reload etc . की सुविधा भी provide करता है।
location भी window Object की ही एक property है , HTML Document में हम इसके methods या properties को window.location या सिर्फ location से access करते हैं।
बैसे तो location Object की कई सारी properties हैं , but कुछ properties इस प्रकार हैं -
| Property Name | Description |
|---|---|
| navigator.href | href property , complete URL return and set करती है , means href की help से current complete URL get भी कर सकते हैं और , new URL assign करके page redirect भी कर सकते हैं। |
| navigator.host | यह port number के साथ host name set and return करती है। |
| navigator.hostname | यह URL के hostname को set या return करती है। |
| navigator.port | इससे port number set या get करते हैं। |
| navigator.origin | यह protocol सहित hostname और port number return करती है। |
| navigator.search | search property के through URL के query string data को set या return करती है। |
| navigator.pathname | pathname property , domain name के बाद और query string को छोड़कर URL return करती है । |
File : location.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScript location Object Example</title>
</head>
<body>
<script type="text/javascript">
/* create a custom link so that we can differentiate everything */
var url = document.createElement('a');
url.href = 'https://www.learnhindituts.com:8080/js/javascript-navigator-object-in-hindi?subject=javaScript';
document.write(`location.protocol : ${url.protocol} <br>`);
document.write(`location.href : ${url.href} <br>`);
document.write(`location.host : ${url.host} <br>`);
document.write(`location.hostname : ${url.hostname} <br>`);
document.write(`location.port : ${url.port} <br>`);
document.write(`location.origin : ${url.origin} <br>`);
document.write(`location.search : ${url.search} <br>`);
document.write(`location.pathname : ${url.pathname} <br>`);
</script>
</body>
</html>location.protocol : https:
location.href : https://www.learnhindituts.com:8080/js/javascript-navigator-object-in-hindi?subject=javaScript
location.host : www.learnhindituts.com:8080
location.hostname : www.learnhindituts.com
location.port : 8080
location.origin : https://www.learnhindituts.com:8080
location.search : ?subject=javaScript
location.pathname : /js/javascript-navigator-object-in-hindi
ऊपर दिए गए example में JavaScript के createElement() method through एक anchor element () create किया , फिर उसके attribute href में website का full URL with port number के साथ assign कर दिया , जिससे हम सही से पता लगा सकें , कि कौन सी property क्या value return कर रही है।
DOM (Document Object Model) के बारे में आगे details से पढ़ेंगे।
location Object के तीन main methods हैं -
| Method Name | Description |
|---|---|
| navigator.reload() | जैसा कि name से स्पष्ट हो रहा है , reload() method का use current URL / Page को refresh करने के लिए किया जाता है। |
| navigator.assign(url) | assign() method दिए गए URL के according document को load करता है , और old URL को document history stack में add कर देता है। |
| navigator.replace(url) | replace method दिए गए URL के according current document को new document से replace करता है। |
assign() और replace में सबसे बड़ा difference यही है कि assign() method दिए गए URL को load करने से पहले current URL को history stack में add कर देता है , जिससे हम new document page पर history.back() function का use करके फिर old document load कर सकते हैं ।
जबकि replace() method pass किये गए URL को current URL से replace कर देता है।
For Example : नीचे Example में , तीन buttons पर ये functions apply किया है।
1. Reload Button पर click करने पर document reload होगा।
Assign & Replace दोनों buttons पर same URL "/js/javascript-history-object-in-hindi" assign किया है,But जब आप history page पर जायेंगे तो वहां से Back button (जिसमे history.back() method ) से वापस यही आ सकते हैं , लेकिन Replace के through जाने पर वो Back button work नहीं करेगा।
window.location.reload();
window.location.assign('/js/javascript-screen-object-in-hindi');
window.location.replace('/js/javascript-history-object-in-hindi');
Reload AssignReplace
I hope अब आप JavaScript में location Object के बारे में अच्छी तरह से समझ गए होंगे।