HTML DOM Link rel गुण वर्तमान और लिंक किए गए दस्तावेज़ के बीच संबंध को सेट/लौटाता है और इसका उल्लेख करना आवश्यक है।
सिंटैक्स
निम्नलिखित सिंटैक्स है −
- rel विशेषता का मान लौटाना
linkObject.rel
- rel को valueString पर सेट करना
linkObject.rel = valueString
मान स्ट्रिंग्स
यहां, “valueString” निम्नलिखित हो सकते हैं −
| valueString | विवरण |
|---|---|
| alternate | यह प्रदान करता है |
| author | यह लिंक किए गए दस्तावेज़ के लेखक का लिंक प्रदान करता है |
| dns-prefetch | यह निर्दिष्ट करता है कि ब्राउज़र को लक्ष्य संसाधन के मूल के लिए DNS रिज़ॉल्यूशन पूर्व में करना चाहिए |
| help | यह यदि कोई हो तो सहायता दस्तावेज़ का लिंक प्रदान करता है |
| icon | यह दस्तावेज़ को दर्शाने के लिए एक आइकन आयात करता है |
| rel | यह वर्तमान और लिंक किए गए दस्तावेज़ के बीच संबंध को सेट/लौटाता है |
| license | यह लिंक किए गए दस्तावेज़ के लिए कॉपीराइट जानकारी प्रदान करता है |
| next | यह दस्तावेज़ों की श्रृंखला में अगले दस्तावेज़ का लिंक प्रदान करता है |
| pingback | यह वर्तमान लिंक किए गए दस्तावेज़ पर पिंगबैक को संभालने वाले पिंगबैक सर्वर का पता प्रदान करता है |
| preconnect | यह निर्दिष्ट करता है कि ब्राउज़र को लक्ष्य संसाधन के मूल से पूर्व में कनेक्ट करना चाहिए यदि कोई हो |
| prefetch | यह निर्दिष्ट करता है कि ब्राउज़र को लक्ष्य संसाधन को पूर्व में लाकर कैश करना चाहिए क्योंकि दस्तावेज़ के फॉलो-अप नेविगेशन के लिए इसकी आवश्यकता होती है |
| preload | यह निर्दिष्ट करता है कि ब्राउज़र एजेंट को वर्तमान नेविगेशन के लिए गंतव्य के अनुसार लक्ष्य संसाधन को पूर्व में लाकर कैश करना चाहिए जो "as" विशेषता द्वारा दिया जाता है (और उस गंतव्य से जुड़ी प्राथमिकता)। |
| prerender | यह निर्दिष्ट करता है कि ब्राउज़र को निर्दिष्ट वेबपेज को पृष्ठभूमि में लोड करना चाहिए। इसलिए, यदि उपयोगकर्ता इस पृष्ठ पर नेविगेट करता है, तो यह पेज लोड को गति देता है |
| prev | यह इंगित करता है कि दस्तावेज़ एक श्रृंखला का हिस्सा है, और श्रृंखला में पिछला दस्तावेज़ संदर्भित लिंक किया गया दस्तावेज़ है |
| search | यह वर्तमान दस्तावेज़ और इसके संबंधित पृष्ठों के माध्यम से खोज करने के लिए उपयोग किए जा सकने वाले संसाधन का लिंक प्रदान करता है। |
| stylesheet | यह वर्तमान दस्तावेज़ में एक स्टाइल शीट आयात करता है |
उदाहरण
आइए Link rel गुण का एक उदाहरण देखें −
<!DOCTYPE html> <html> <head> <title>Link rel</title> <link id="extStyle" rel="stylesheet" type="text/css" href="style.css"> </head> <body> <form> <fieldset> <legend>Link-rel</legend> <div id="divDisplay"></div> </fieldset> </form> <script> var divDisplay = document.getElementById("divDisplay"); var extStyle = document.getElementById("extStyle"); if(extStyle.rel === 'stylesheet') divDisplay.textContent = 'लिंक किया गया दस्तावेज़ स्टाइलशीट प्रकार का है'; else divDisplay.textContent = 'लिंक किया गया दस्तावेज़ '+extStyle.rel+' प्रकार का है'; </script> </body> </html>
उपरोक्त उदाहरण में ‘style.css' में शामिल है −
form { width:70%; margin: 0 auto; text-align: center; } * { padding: 2px; margin:5px; } input[type="button"] { border-radius: 10px; }
आउटपुट
यह निम्नलिखित आउटपुट उत्पन्न करेगा −
