HTML <आधार> तत्व के साथ दस्तावेज़ बेस URL निर्दिष्ट करना

वेबसाइटों को लिंक की एक श्रृंखला के साथ बनाया गया है, जो छवियों और स्टाइलशीट जैसे पृष्ठों और स्रोतों की ओर इशारा करते हैं। करने के दो तरीके हैं इन स्रोतों से लिंक करने वाले URL को निर्दिष्ट करें: या तो एक निरपेक्ष पथ या सापेक्ष पथ का उपयोग करें.

पूर्ण पथ विशिष्ट गंतव्य को संदर्भित करता है, आमतौर पर इसे डोमेन नाम (HTTP के साथ) के साथ शुरू किया जाता है जैसे www.domain.com/destination/source.jpg. सापेक्ष पथ इसके विपरीत है: लिंक गंतव्य मूल स्थान या आपकी वेबसाइट के डोमेन नाम पर निर्भर करता है.

एक विशिष्ट सापेक्षिक पथ इस तरह दिखेगा:

यदि आपका वेबसाइट डोमेन है, उदाहरण के लिए, hongkiat.com छवि पथ का समाधान होगा hongkiat.comimages_2 / निर्दिष्ट करने-दस्तावेज़ आधार-यूआरएल-साथ एचटीएम्एल आधार element.png. आपको यह समझना चाहिए कि क्या आप कुछ समय से वेबसाइट विकसित कर रहे हैं.

लेकिन आपमें से ज्यादातर ने शायद इसके बारे में नहीं सुना होगा तत्व। यह HTML टैग HTML4 के बाद से आस-पास है, फिर भी जंगली में इसके कार्यान्वयन के बारे में बहुत कम देखा जाता है। W3C इस तत्व का वर्णन करता है:

“आधार तत्व लेखकों को निर्दिष्ट करने की अनुमति देता है दस्तावेज़ आधार URL रिश्तेदार URL, और के नाम को हल करने के प्रयोजनों के लिए डिफ़ॉल्ट ब्राउज़िंग संदर्भ निम्नलिखित हाइपरलिंक्स के प्रयोजनों के लिए.”

इस तत्व मूल रूप से वेब पृष्ठों में सापेक्ष पथ के लिए आधार URL तय करता है। मूल स्थान या आपकी वेबसाइट के डोमेन के आधार पर, आप इसे कहीं और इंगित कर सकते हैं, शायद उस URL की तरह जहां आपके संसाधन CDN (सामग्री वितरण नेटवर्क) में रहते हैं। आइए देखें कि वास्तव में यह कैसे काम करता है.

आधार तत्व का उपयोग करना

पक्ष के साथ परिभाषित किया गया है तथा के भीतर टैग . निम्न उदाहरण को देखते हुए, हमने Google को आधार URL सेट किया.

यह विनिर्देश दस्तावेज़ के भीतर सभी रास्तों को प्रभावित करेगा, जिसमें एक निर्दिष्ट किया गया है href विशेषता और src छवियों का। इसलिए, मान लें कि हमारे पास इस तरह के एक रिश्तेदार पथ के साथ सेट किए गए दस्तावेज़ में एक स्टाइलशीट, चित्र और लिंक हैं:

  एंकर लिंक  

भले ही हमारा वेब पेज चालू है demo.hongkiat.com रिश्तेदार पथ को संदर्भित करेगा hongkiat.maxcdn.com, में निर्दिष्ट आधार पथ का अनुसरण करना टैग। लिंक पर मँडरा करने की कोशिश करें, और ब्राउज़र आपको दिखाएगा कि रास्ता बिल्कुल कहाँ जा रहा है.

सभी रिश्तेदार पथ अंततः होंगे:

  एंकर लिंक  

डिफ़ॉल्ट लिंक लक्ष्य निर्धारित करना

आधार URL को परिभाषित करने के अलावा, टैग डिफ़ॉल्ट लिंक लक्ष्य को इसके माध्यम से भी सेट कर सकता है लक्ष्य विशेषता। कहें कि आप दस्तावेज़ के सभी लिंक खोलना चाहते हैं ब्राउज़र में नया टैब, ठीक लक्ष्य साथ में _blank, इस तरह.

सीमाएं

हालाँकि, टैग कुछ परिस्थितियों में दो जोड़े रखता है:

पहले ब्राउज़र समर्थन महान है; यह IE6 में काम करता है। लेकिन, IE6 सोचता है कि इसे एक समापन टैग की आवश्यकता है . यह दस्तावेज़ में एक पदानुक्रम समस्या पैदा कर सकता है, यदि समापन टैग अनिर्दिष्ट है। इस मुद्दे को संबोधित करने का एक सरल त्वरित तरीका है एक टिप्पणी के भीतर बंद करना, .

यदि आप उपयोग कर रहे हैं # के साथ संयोजन के रूप में दस्तावेज़ के भीतर अनुभागों से लिंक करने के लिए, आप संभवतः इंटरनेट एक्सप्लोरर 9 में एक समस्या का सामना कर सकते हैं। संदर्भित अनुभाग पर कूदने के बजाय, इंटरनेट एक्सप्लोरर 9 पृष्ठ लोड करेगा.

इसके अलावा, एक खाली href वर्तमान निर्देशिका से लिंक करने के बजाय आधार URL में परिणाम आएगा जहां पेज रहता है (यह डिफ़ॉल्ट ब्राउज़र व्यवहार है), जिससे अप्रत्याशित अनपेक्षित समस्याएँ हो सकती हैं.

लपेटें

एक आसान HTML सुविधा है जो वेब दस्तावेज़ में लिंक संदर्भ को सरल बना सकती है। कम से कम नुकसान के लिए टैग का उपयोग करें। नीचे दिए गए इन संदर्भों का अनुसरण करें टैग:

• निरपेक्ष और सापेक्ष URL - MSDN
• HTML बेस एलिमेंट - W3C