Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> JavaScript

JavaScript: URL पर जाएं: पूरी गाइड

window.location मान आपके ब्राउज़र में वर्तमान URL को दर्शाता है जिसे आप देख रहे हैं। आप इस मान को जावास्क्रिप्ट में किसी अन्य URL पर जाने के लिए बदल सकते हैं। यह उपयोगी है यदि आप किसी उपयोगकर्ता को किसी अन्य पेज पर रीडायरेक्ट करना चाहते हैं। आप assign() या replace() मेथड्स का भी उपयोग कर सकते हैं।

ऐसे कुछ कारण हैं जिनसे आप किसी उपयोगकर्ता को किसी अन्य वेबसाइट या अपडेटेड पथ नाम पर रीडायरेक्ट करना चाह सकते हैं। ज्यादातर मामलों में, आप यूजर के ऑथराइजेशन के आधार पर रीडायरेक्ट करना चाह सकते हैं - चाहे क्लाइंट किसी साइट पर लॉग इन हो। इस लेख में, हम देखते हैं कि जावास्क्रिप्ट का उपयोग करके वेब पेज पर ऐसा कैसे करें।

JavaScript URL पर जाएं

जावास्क्रिप्ट ब्राउज़र हिस्ट्री API आपको नए URL पर जाने देता है। आप नए URL पर नेविगेट करने के लिए निम्नलिखित मेथड्स का उपयोग कर सकते हैं:

  • window.location को नया मान असाइन करना।
  • window.assign() मेथड का उपयोग करना।
  • window.replace() मेथड का उपयोग करना।

ये तीनों मेथड्स किसी अन्य URL पर नेविगेट करने के लक्ष्य को समान रूप से पूरा करते हैं। आइए इनमें से प्रत्येक मेथड को देखें।

JavaScript window.location मान

नए URL पर नेविगेट करने के लिए, ब्राउज़र के हिस्ट्री API से लोकेशन ऑब्जेक्ट का उपयोग करें। सेशन हिस्ट्री आपको लोकेशन ऑब्जेक्ट को नए URL पर पुनः असाइन करने या उसी ऑब्जेक्ट पर href प्रॉपर्टी का उपयोग करने देती है।

इस दृष्टिकोण के लिए सिंटैक्स है:

window.location = "url";

"url" वह URL दर्शाता है जिसे आप यूजर को विजिट करवाना चाहते हैं। जब कोड की यह लाइन चलती है, तो एक जावास्क्रिप्ट रीडायरेक्ट शुरू होता है। यह उस पेज को बदल देता है जिसे यूजर अपने वेब ब्राउज़र में देखता है।

आइए इस मेथड को उदाहरण के रूप में देखें:

81% प्रतिभागियों ने कहा कि बूटकैंप में भाग लेने के बाद उन्हें अपनी टेक जॉब संभावनाओं के बारे में अधिक आत्मविश्वास महसूस हुआ। आज ही बूटकैंप से मैच करवाएं।

औसत बूटकैंप ग्रेजुएट ने करियर ट्रांजिशन में छह महीने से कम समय बिताया, बूटकैंप शुरू करने से लेकर पहली नौकरी ढूंढने तक।

const handleClick = (e) => { console.log("click") window.location = ('https://careerkarma.com') // window.location.href = ('https://careerkarma.com') console.log(window.location) }

जब handleClick() फंक्शन चलता है, तो हमारा कोड जावास्क्रिप्ट कंसोल पर एक स्टेटमेंट लॉग करेगा। फिर, हमारा कोड हमें एक नए URL पर रीडायरेक्ट करेगा।

JavaScript window.location.assign()

लोकेशन ऑब्जेक्ट में assign() नामक एक रीडायरेक्ट मेथड होता है। यह मेथड वर्तमान URL को असाइन किए गए URL के साथ असाइन करता है और इसे हिस्ट्री स्टैक में जोड़ता है।

हिस्ट्री स्टैक उन पेजेज को दर्शाता है जिन्हें आपने देखा है (उस "बैक एरो" के बारे में सोचें जो आपको पिछले पेज पर वापस जाने देता है)।

निम्नलिखित सिंटैक्स पर विचार करें:

window.location.assign("url");

पिछले उदाहरण के विपरीत, हमें किसी जावास्क्रिप्ट वेरिएबल (window.location) को कोई मान असाइन करने की आवश्यकता नहीं है। इसके बजाय, हम यूजर द्वारा देखे जाने वाले वेब पेज को बदलने के लिए एक मेथड का उपयोग करते हैं।

हिस्ट्री स्टैक ही है जिससे ब्राउज़र याद रखता है कि बैक बटन या फॉरवर्ड बटन कहां जाना चाहिए।

आइए इस मेथड का पूरा उदाहरण देखें:

const handleClick = (e) => { console.log("click") window.location.assign('https://careerkarma.com'); }

यदि आप उसी साइट पर किसी अलग पेज पर रीडायरेक्ट करना चाहते हैं, तो लोकेशन ऑब्जेक्ट पर पथ नाम प्रॉपर्टी का उपयोग करें:

const handleClick = (e) => { console.log("click") window.location.pathname = ('/newpage.html') console.log(window.location) }

JavaScript window.location.replace()

आपके पास यह नियंत्रित करने की क्षमता है कि यूजर बैक बटन का उपयोग करके पिछली साइट पर वापस जा सकता है या नहीं।

replace() मेथड का उपयोग करके, आप यूजर को किसी साइट पर नेविगेट कर सकते हैं और उन्हें पिछले पेज पर वापस जाने से रोक सकते हैं। दूसरी ओर, assign() मेथड, आपके द्वारा पहले देखे गए पेज को आपके ब्राउज़र हिस्ट्री में सेव करता है। इसलिए, assign() के साथ आप उस अंतिम पेज को देख सकते हैं जिस पर आप थे।

आइए replace() मेथड को देखें:

window.location.replace("url");

assign() की तरह, replace() एक मेथड है। यह मेथड एक आर्गुमेंट स्वीकार करता है: वह URL जिस पर आप यूजर को इंगित करना चाहते हैं।

हम कस्टम फंक्शन के साथ replace() मेथड का उपयोग कर सकते हैं ताकि मेथड चलने पर यूजर द्वारा देखे जाने वाले URL को बदला जा सके:

const handleClick = (e) => { console.log("click") window.location.replace('https://careerkarma.com'); }

इस Repl.it का उपयोग अपनी पसंद के URL पर रीडायरेक्ट करने के लिए विभिन्न मेथड्स के साथ खेलने के लिए करें। आप कोड को डिफ़ॉल्ट पर रीसेट करने के लिए रन बटन का उपयोग कर सकते हैं।

निष्कर्ष

जावास्क्रिप्ट में URL पर जाने के तीन तरीके हैं: window.location का उपयोग करना, window.location.assign() मेथड, या window.location.replace() मेथड।

क्या आप जावास्क्रिप्ट के बारे में अधिक जानना चाहते हैं? हमारा How to Learn JavaScript गाइड देखें। इस गाइड में जावास्क्रिप्ट सीखने के बारे में शीर्ष सुझाव और शुरुआती और इंटरमीडिएट डेवलपर्स के लिए व्यापक लर्निंग संसाधनों की सूची है।

  1. window.location का उपयोग करके किसी भिन्न URL पर रीडायरेक्ट कैसे करें? window.location का उपयोग करके किसी भिन्न URL पर रीडायरेक्ट कैसे करें?

    आपने ऐसी स्थिति का सामना किया होगा जहां आप पेज X पर पहुंचने के लिए एक URL पर क्लिक करते हैं लेकिन आंतरिक रूप से आपको दूसरे पेज Y पर निर्देशित किया जाता है। यह पेज रीडायरेक्शन के कारण होता है। क्लाइंट साइड पर JavaScript का उपयोग करके पेज रीडायरेक्ट करना काफी सरल है। अपनी साइट विज़िटर्स को नए पेज पर

  1. JavaScript BOM Window Screen ऑब्जेक्ट JavaScript BOM Window Screen ऑब्जेक्ट

    JavaScript BOM Window Screen ऑब्जेक्ट में क्लाइंट की स्क्रीन के बारे में जानकारी होती है। Screen ऑब्जेक्ट की प्रॉपर्टीज प्रॉपर्टी विवरण screen.width यूजर की स्क्रीन की चौड़ाई पिक्सेल में लौटाता है। screen.height यूजर की स्क्रीन

  1. iOS पर लोकेशन शेयरिंग की पूरी गाइड iOS पर लोकेशन शेयरिंग की पूरी गाइड

    iOS डिवाइस कई तरीकों से आपके दोस्तों और परिवार के साथ आपका स्थान साझा कर सकते हैं। ज्यादातर मामलों में, यह iCloud लोकेशन शेयरिंग पर किया जाता है, जो Find My ऐप के साथ इंटरफेस करता है। आप Google Maps जैसे थर्ड-पार्टी ऐप्स का भी उपयोग कर सकते हैं। यहां iOS पर लोकेशन शेयरिंग की आपकी अंतिम गाइड है, शुरु