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 के बारे में अच्छी तरह से समझ गए होंगे।
Hi ! I'm Rahul Kumar Rajput founder of learnhindituts.com. I'm a software developer having more than 4 years of experience. I love to talk about programming as well as writing technical tutorials and blogs that can help to others. I'm here to help you navigate the coding cosmos and turn your ideas into reality, keep coding, keep learning :)
Get connected with me. :) LinkedIn Twitter Instagram Facebook
