हेल्लो दोस्तों ! आज इस पोस्ट में जावा स्क्रिप्ट के बारे में बताया गया है की JavaScript Location Object in hindi क्या होता है कैसे काम करता है और भी बहुत कुछ दिया गया है तो चलिए शुरू करते है
Contents
JavaScript location object का परिचय
किसी भी url से जुडी जरुरी information जैसे की protocol ,port और hostname आदि की जानकारी प्राप्त करने के लिए JavaScript आपको window.location object को provide करती है इस object से आप current url भी प्राप्त कर सकते है जो की साथ ही इस object से browser को new page पर भी redirect किया जाता है
location object को आप window object के द्वारा access किया जाता है जिसका आपको general syntax आपको निचे दिया जा रहा है
window.location.property/method
इसे आप बिना window object के भी प्रयोग कर सकते है
location.property/method
location object के साथ 9 property available होता है
- Href=returns current url
- Hostname-returns hostname of current page
- Pathname-returns pathname of current page
- Protocol-returns protocol used for current page
- Port-returns current port used for current page
- Hash-returns anchor part of a url
- Host-returns hostname and port name of a url
- Origin-returns protocols ,hostname and port number all together
- Search-returns query part of a url
location object के साथ 3 methods भी available होता है
- Assign()-redirects browser to a new url
- Reload()-reloads current document
- Replace()-replace current page with new page
इन्ही propertie और method के द्वारा आप जरुरी information को access करते है इन properties और method के बारे में आपको निचे details से दिया जा रहा है
href
window location object की href property के द्वारा आप webpage का current url को प्राप्त कर सकते है जिसका आपको example निचे दिया जा रहा है
<html>
<script type=”text/javascript”>
var CurURL=window.location.href;
document.write(“current url is :”+CurURL);
</script>
</html>उपर दिए गए script में आपको निचे दिया गया आउटपुट को generate करता है
https://allsitein.com
hostname
JavaScript में window.location.hostname property के current page का hostname को return करता है जिसका आपको example निचे दिया जा रहा है
<html>
<script type=”text/javascript”>
var hostName=window.location.hostname;
document.write(“Host name is :”+hostname);
</script>
</html>उपर दिए गए script में आपको निचे दिया गया आउटपुट को generate करता है
www.c3school.in
pathname
JavaScript में window.location.pathname के property के द्वारा current page का pathname को return किया जाता है जिसका आपको example निचे दिया जा रहा है
<html> <script type=”text/javascript”> document.write(window.location.pathname); </script> </html>
उपर दिए गए script में आपको निचे दिया गया आउटपुट को generate करता है
/about.html
protocol
यह property उस protocols का नाम को return करती है जिसे current page को show करने के लिए प्रयोग किया जाता है जिसका आपको example निचे दिया जा रहा है
<html>
<script type=”text/javascript”>
var protocolName=window.location.protocol;
document.write(protocol is “+protocolName);
</script>
</html>उपर दिए गए script में आपको दिया गया आउटपुट को generate करती है
protocol is https:
port
यह property current url का port के number return करती है जो यदि port number default(80) है तो कुछ भी return नहीं किया जाता है अन्य port number होने पर ही उसकी वैल्यू को return की जाती है जिसका आपको example निचे दिया जा रहा है
<html> <script type=”text/javascript”> var portName=window.location.port; document.write(“port is : “+portName); </script> </html>
उपर दिए गए script में आपको निचे दिया गया आउटपुट को generate करता है
port is :
hash
यह property की किसी url का anchor part return और set करने के लिए प्रयोग की जाती है result # के साथ को return किया जाता है जिसका example आपको निचे दिया जा रहा है
<html> <script type=”text/javascript”> window.location.hash=”part”; var a part=window.location.hash; document.write(“anchor part is :”+aPart); </script> </html>
उपर दिए गए script में आपको निचे दिया गया आउटपुट को generate करता है
anchor part is :#part
host
यह property host name और port number को एक साथ ही return करती है default port number होने पर कोई भी वैल्यू को नहीं return की जाती है जिसका आपको example निचे दिया जा रहा है
<html> <script type=”text/javascript”> document.write(window.location.host); </script> </html>
उपर दिए गए script में आपको निचे दिया गया आउटपुट को generate करता है
www.c3school.in
origin
यह property url से related protocols ,hostname और port number एक साथ ही return करती है जिसका आपको example निचे दिय जा रहा है
<html> <script type=”text/javascript”> document.write(result); </script> </html>
उपर दिए गए script में आपको निचे दिय जा रहा आउटपुट को generate करता है
https://www.c3school.in
search
इस property के द्वारा url का query को string part में return किया जाता है जिसका आपको example निचे दिया जा रहा है
<html> <script type=”text/javascript”> var res=window.location.search; document.write(res); </script> </html>
उपर दिए गए script में आपको निचे दिया जा रहा आउटपुट को generate करता है
?javascript=syntax
location object methods
assign()
यह method को डिफाइन किये गए url को नए document में load करता है जिसका आपको example निचे दिया जा रहा है
<html>
<body>
<button onclick=”myFunction()”<click here </button>
<script type=”text/javascript”>
function myFunction()
{
window.location.assign(https://www.google.com);
}
</script>
</body>
</html>उपर दिए गए script में डिफाइन किये गए url के साथ नया document को लोड करती है
reload()
ये method current document को reload करती है जिसका आपको example निचे दिया जा रहा है
<html>
<body>
<button onclick=”myFunction()”>reload</button>
<script type=”text/javascript”>
window.location.reload();
</script>
</body>
</html>उपर दिए गए script में button को click होने पर current document को reload हो जाती है
replace()
यह method assign() की तरह ही नया document को load करती है लेकिन इस method के प्रयोग से old document की history को delete हो जाती है जिसका आपको example निचे दिया जा रहा है
<html>
<body>
<button onclick=”myFunction()”>replace </button>
<script type=”text/javascript”>
function myFunction()
{
window.location.replace(https://www.google.com);
}
</script>
</body>
</html>उपर दिए गए script में आपको button के click होने पर current document नए document के द्वारा replace कर दिय जाता है
reference-https://www.tutorialrepublic.com/javascript-tutorial/javascript-window-location.php
निवेदन:-आप सभी छात्र –छात्रों से निवेदन है की अगर आपको ये Topic( JavaScript Location Object in hindi) अच्छा लगा हो तो कृपया आप इस वेबसाइट के बारे में अपने दोस्तों को जरुर बताये अगर कोई topic( JavaScript Location Object in hindi)से संबधित प्रश्न हो तो कमेंट्स(comments) आपके लिए ही बना है और किसी Subject (JavaScript Location Object in hindi)के लेकर भी कोई प्रश्न हो तो कमेंट करे