क्या खाली href मान्य है?


179

हमारे वेब डेवलपर्स में से एक ड्रॉप डाउन सूची की स्टाइलिंग के लिए प्लेसहोल्डर के रूप में निम्न HTML का उपयोग करता है।

<a href="" class="arrow"></a>

क्या इसे एंकर टैग माना जाता है?

चूँकि कोई href मान नहीं है, यह हमारे लिंक चेकर की कुछ रिपोर्टों पर टूटा हुआ है।


10
यह IE में काम नहीं करता है, हालांकि! अच्छी तरह से यह IE में काम करता है, लेकिन एक पूरी तरह से अलग व्यवहार के साथ, कल्पना के खिलाफ। तो यह प्रति कल्पना के अनुसार मान्य है, लेकिन व्यवहार में नहीं: ((
ZhongYu

Bayou.io ने क्या कहा, इसका विस्तार करते हुए IE दस्तावेज़ के ऊपर निर्देशिका से लिंक करता है: stackoverflow.com/questions/7966791/…
Nate

1
हां, IE (7/8, आदि) के पुराने संस्करणों में एक खाली href, निर्देशिका लिस्टिंग के रूप में खराब परिणाम हो सकता है। इस विषय पर बहुत कुछ प्रलेखित है यदि आप इसे Google
Ringo

उदाहरण के लिए: gtmetrix.com/avoid-empty-src-or-href.html । कभी भी पुराने ब्राउज़रों का ध्यान न रखें, यह वर्तमान IE, एज, और वेबकिट ब्राउज़र को भी प्रभावित करता है।
रिंगो

जवाबों:


60

यद्यपि यह प्रश्न पहले से ही उत्तर है ( tl; dr: हाँ, एक खाली hrefमान मान्य है), मौजूदा उत्तरों में से कोई भी प्रासंगिक विनिर्देशों का संदर्भ नहीं देता है।

खाली स्ट्रिंग URI नहीं हो सकती। हालाँकि, hrefविशेषता केवल URI को मान के रूप में नहीं लेती है, बल्कि URI संदर्भों को भी। एक खाली स्ट्रिंग एक URI संदर्भ हो सकता है।

HTML 4.01

HTML 4.01 RFC 2396 का उपयोग करता है , जहाँ वह धारा 4.2 में कहता है समान-दस्तावेज संदर्भ (बोल्ड जोर मेरा):

एक URI संदर्भ जिसमें URI नहीं होता है, वह वर्तमान दस्तावेज़ का संदर्भ है। दूसरे शब्दों में, किसी दस्तावेज़ के भीतर एक खाली यूआरआई संदर्भ को उस दस्तावेज़ की शुरुआत के संदर्भ के रूप में व्याख्या किया गया है , और केवल एक खंड युक्त पहचानकर्ता वाला संदर्भ उस दस्तावेज़ के पहचाने गए टुकड़े का एक संदर्भ है।

RFC 2396 को RFC 3986 (जो वर्तमान में IETF का URI मानक है ) द्वारा पालन किया जाता है , जो अनिवार्य रूप से यही कहता है

एचटीएमएल 5

HTML5 का उपयोग करता है ( मान्य URL संभावित स्थानों से घिरा हुआवैध URL ) W3C का URL कल्पना , जिसे बंद कर दिया गया है। इसके बजाय WHATWG के URL मानक का उपयोग किया जाना चाहिए (अंतिम अनुभाग देखें)।

HTML 5.1

HTML 5.1 का उपयोग करता है ( मान्य URL संभावित स्थानों से घिरा हुआवैध URL ) WHATWG का URL मानक (अगला भाग देखें)।

WHATWG HTML

WHATWG के एचटीएमएल का उपयोग करता है ( मान्य URL संभावित रिक्त स्थान से घिरा हुआ ) की परिभाषा मान्य URL स्ट्रिंग से WHATWG के URL स्टैंडर्ड , जहां यह कहते हैं कि यह एक हो सकता है कि रिश्तेदार-यूआरएल-साथ-टुकड़ा स्ट्रिंग , कम से कम जो चाहिए एक हो रिश्तेदार-URL स्ट्रिंग , जो एक पथ-सापेक्ष-स्कीम-कम-URL स्ट्रिंग हो सकती है , जो एक पथ-सापेक्ष- URL स्ट्रिंग है , जो किसी योजना स्ट्रिंग के साथ प्रारंभ नहीं होती है :, और इसकी परिभाषा कहती है (बोल्ड जोर मेरा):

एक पथ- सापेक्ष- URL स्ट्रिंग शून्य या अधिक URL-पथ-खंड तार होनी चाहिए , जो U + 002F (/) द्वारा एक दूसरे से अलग होती है, और U + 002F (/) से शुरू नहीं होती है।


184

यह मान्य है।

हालांकि, मानक अभ्यास का उपयोग href="#"या कभी-कभी करना है href="javascript:;"


23
जैसा कि RFC 2396 में कहा गया है: एक URI संदर्भ जिसमें URI शामिल नहीं है, वर्तमान दस्तावेज़ का संदर्भ है। दूसरे शब्दों में, एक दस्तावेज़ के भीतर एक खाली यूआरआई संदर्भ को उस दस्तावेज़ की शुरुआत के संदर्भ के रूप में व्याख्या किया गया है,
अक्टूबर

32
जब मैं क्लिक करता हूं href="#", तो IE में पृष्ठ के शीर्ष पर ध्यान केंद्रित करता हूं, इसलिए मुझे लगता है href="javascript:;"कि बेहतर है
डेकार्ड

32
href = "#" एक एंटी-पैटर्न है। यह ब्राउज़र इतिहास में एक अतिरिक्त प्रविष्टि जोड़ता है और कुछ मामलों में ब्राउज़र को शीर्ष पर स्क्रॉल करता है, आप बस href विशेषता को छोड़ सकते हैं यदि आप इसका उपयोग नहीं कर रहे हैं। यह डिफ़ॉल्ट रूप से "" हो जाएगा और इसलिए यदि रोका नहीं गया तो पृष्ठ को पुनः लोड करें।
तोश

16
@ संतोष, नहीं, मुझे पूरा यकीन है कि अगर आप href विशेषता को छोड़ देते हैं, तो <a> तत्व लिंक के रूप में स्टाइल नहीं किया जाता है, ध्यान देने योग्य नहीं है, और <href = "के रूप में लिंक नहीं बनाता है > या <a href> करता है। यदि यह आपके लिए काम करता है, तो क्या आप इसे दिखाते हुए JSFiddle को साझा कर सकते हैं?
गुई प्रा

6
@ संतोष, तुम्हें पता है क्या मज़ेदार है? HTML5 के बाद से, विशेषता को छोड़ने से उस तरह से काम करना चाहिए, w3.org/TR/html5/text-level-semantics.html#the-a-element (नीचे दिए गए उस उत्तर को प्रस्तुत करने के लिए धन्यवाद आधा) देखें: जाहिरा तौर पर यह नहीं हुआ है। विक्रेताओं द्वारा अभी तक लागू किया गया है, और चूंकि यह अभी भी केवल उम्मीदवार की सिफारिश है, यह बताना मुश्किल है कि क्या इसे अंतिम मानक में रखा जाएगा या क्या विक्रेता इससे पहले पालन करेंगे।
गुई प्राग

115

जैसा कि दूसरों ने कहा है, यह मान्य है।

हालांकि प्रत्येक दृष्टिकोण के कुछ डाउनसाइड हैं:

href="#" ब्राउज़र इतिहास में एक अतिरिक्त प्रविष्टि जोड़ता है (जो कि बैक-बटनिंग के समय कष्टप्रद होता है)।

href="" पेज पुनः लोड करता है

href="javascript:;" कोई समस्या नहीं लगती है (गन्दा और व्यर्थ दिखने के अलावा) - किसी को भी किसी को पता है?


22
एक और दिलचस्प है href = "//: 0", जो सर्वर से अनुरोध नहीं करेगा और न ही कोई इतिहास छोड़ देगा।
diachedelic

2
//: 0 मेरी कुछ छवियों को क्रोम में लोड करने में विफल रहता है। लगता है कि Chrome एक निरस्त आदेश प्राप्त करने के रूप में व्याख्या करता है।
डेविड ग्रेनियर

5
href: "जावास्क्रिप्ट :;" बस क्या था मुझे एंड्रॉइड एक iOS वेबवेज़
dumazy

2
IE दस्तावेज़ के ऊपर निर्देशिका के लिए लिंक: stackoverflow.com/questions/7966791/…
Nate

1
मैंने इसका परीक्षण नहीं किया है, लेकिन मुझे संदेह है कि href = "जावास्क्रिप्ट: ;; उस सामग्री सुरक्षा नीति का उल्लंघन करेगा जो इनलाइन जावास्क्रिप्ट को रोकती है। यदि आप इस नीति को चालू करने का इरादा रखते हैं, तो मैं विकल्पों में से एक का उपयोग करूंगा।
मार्क गुड

60

हालांकि यह पूरी तरह से वैध HTML हो सकता है, जिसमें एक href शामिल नहीं करना है, विशेष रूप से एक ऑनक्लिक हैंडलर के साथ, कुछ बातों पर विचार करना है: यह टैलिंडेक्स मान सेट किए बिना कीबोर्ड-फ़ोकस करने योग्य नहीं होगा। इसके अलावा, यह इंटरनेट एक्सप्लोरर का उपयोग करके स्क्रीनरीडर सॉफ्टवेयर के लिए दुर्गम होगा, क्योंकि IE एक्सेसबिलिटी इंटरफेस के माध्यम से रिपोर्ट करेगा कि कोई भी एंकर तत्व बिना href विशेषता के रूप में ध्यान केंद्रित करने योग्य नहीं है, चाहे टैबइंडेक्स सेट किया गया हो।

तो जबकि निम्नलिखित पूरी तरह से मान्य हो सकते हैं:

<a class="arrow">Link content</a>

यह स्पष्ट रूप से एक शून्य प्रभाव href विशेषता जोड़ने के लिए बेहतर है

<a href="javascript:void(0);" class="arrow">Link content</a>

सभी उपयोगकर्ताओं के पूर्ण समर्थन के लिए, यदि आप किसी चित्र को प्रस्तुत करने के लिए CSS के साथ कक्षा का उपयोग कर रहे हैं, तो आपको कुछ पाठ सामग्री भी शामिल करनी चाहिए, जैसे शीर्षक विशेषता क्या हो रहा है इसका एक पाठ्य विवरण प्रदान करने के लिए।

<a href="javascript:void(0);" class="arrow" title="Go to linked content">Link content</a>

1
यह उल्लेख करने के लिए धन्यवाद कि hrefपहुँच क्षमता में गड़बड़ी के कारण चूक होगी।
डैनियल सोकोलोस्की

1
मैं एक एक्सेसिबिलिटी के नजरिए से भी जोड़ूंगा - कि hrefकिसी रिलेटिव / एब्सोल्यूट पाथ के अलावा किसी और चीज की वैल्यू सेट करने से स्क्रीन रीडर इश्यूज हो जाएंगे। इस समस्या के लिए हैश / पाउंड प्रतीक का उपयोग करने से बचें क्योंकि यह इसके लिए नहीं है। स्क्रीन रीडर (वर्तमान में VoiceOver करता है) आपके लिंक को एक खंड पहचानकर्ता (वर्तमान पृष्ठ में कहीं लिंक ) घोषित करता है और यह मानकों के दृष्टिकोण से भी मान्य है। w3.org/2001/tag/2011/01/HashInURI-20110115#NakedHash
मिशेल हेबर्ट

27

वर्तमान HTML5 ड्राफ्ट भी href विशेषता को पूरी तरह से हटा देता है।

यदि किसी तत्व में कोई href विशेषता नहीं है, तो वह तत्व एक प्लेसहोल्डर का प्रतिनिधित्व करता है जहां एक लिंक अन्यथा रखा जा सकता है, अगर यह प्रासंगिक था।

आपके प्रश्न का उत्तर देने के लिए: हाँ यह मान्य है।


6
हां, लेकिन - कुछ ब्राउज़रों में <a>कोई तत्व नहीं hrefहै। उदाहरण के लिए, क्रोम: ("और अन्य अजीब चीजों) में" हॉवर "शैलियाँ काम नहीं करती हैं
एलेक्स

एक <a>टैग के बिना कुछ और काhref प्रतिनिधित्व करता है , एक लिंक नहीं (पारंपरिक रूप से एक लंगर)। इसके अलावा, एक वैकल्पिक विशेषता और एक विशेषता के बीच अंतर है जो खाली हो सकता है।
कोबी

19

वास्तव में, आप इसे खाली छोड़ सकते हैं (W3 सत्यापनकर्ता शिकायत नहीं करता है)।

विचार को एक कदम आगे बढ़ाते हुए: = "" को छोड़ दें। इसका लाभ यह है कि लिंक को वर्तमान पृष्ठ के एंकर के रूप में नहीं माना जाता है।

<a href>sth</a>

यद्यपि: <a href></a>स्पष्ट रूप से देखे गए मूल्य के बिना href का गुणन करें। IE7 द्वारा विशेषता को गिराया जा सकता है।
c24w

1
मुझे यह समाधान भी पसंद है। क्या आप IE7 व्यवहार को छोड़कर किसी भी अन्य नुकसान के बारे में जानते हैं?
rinat.io

यह अवैध सिंटेक्स है। युक्ति के अनुसार "[खाली गुण] सिंटैक्स को केवल बूलियन विशेषताओं के लिए अनुमति दी जाती है।"
राबर्ट सीमर

9

जब तक W3 के सत्यापनकर्ता खाली hrefविशेषता के बारे में शिकायत नहीं कर सकते , वर्तमान HTML5 वर्किंग ड्राफ्ट निर्दिष्ट करता है:

hrefपर aऔर areaतत्वों की विशेषता में एक मान होना चाहिए जो रिक्त स्थानों से घिरा एक मान्य URL है

एक मान्य URL एक URL है जो URL मानक का अनुपालन करता है । अब URL Standard आपके सिर को घेरने के लिए थोड़ा भ्रमित है, हालांकि कहीं भी यह नहीं बताया गया है कि URL एक खाली स्ट्रिंग हो सकता है।

... जिसका मतलब है कि एक खाली स्ट्रिंग नहीं है एक मान्य URL है।

HTML5 वर्किंग ड्राफ्ट, हालांकि, यह बताता है:

नोट: यह विशेषता और तत्वों की आवश्यकता नहीं है ; जब उन तत्वों में विशेषताएँ नहीं होती हैं तो वे हाइपरलिंक नहीं बनाते हैं।hrefaareahref

इसका मतलब है कि हम hrefविशेषता को पूरी तरह से छोड़ सकते हैं:

<a class="arrow"></a>

आपका इरादा है कि इन है href-less aतत्वों अभी भी कुंजीपटल interraction की आवश्यकता होती है चाहिए, तो आप एक बताए के सामान्य मार्ग नीचे जाना होगा roleऔर tabindexअपने सामान्य क्लिक / keydown संचालकों के साथ:

<a class="arrow" role="button" tab-index="0"></a>

वास्तव में। दुर्भाग्य से, जैसा कि आपने उद्धृत किया है, hrefयह एक हाइपरलिंक नहीं है, जो onclickकीबोर्ड उपयोगकर्ताओं के लिए कार्यक्षमता को दुर्गम बनाता है ।
आइज

7

चेतावनी:

मेरे अनुभव में, hrefविशेषता को छोड़ने से अभिगम्यता के लिए समस्याएँ पैदा होती हैं क्योंकि कीबोर्ड नेविगेशन इसे अनदेखा कर देगा और कभी भी इसे फोकस नहीं देगा जैसे कि यह href उपस्थित होगा। मैन्युअल रूप से टैबइन्डेक्स में आपके तत्व को शामिल करना एक तरीका है।


3

यह मान्य है लेकिन जैसे UpTheCreek ने कहा 'प्रत्येक दृष्टिकोण के कुछ डाउनसाइड हैं'

अगर आप ajax को टैग के माध्यम से कॉल कर रहे हैं तो href = "" इस तरह से पेज को पुनः लोड करते रहेंगे और ajax कोड को कभी भी कॉल नहीं किया जाएगा ...

बस इस विचार को साझा करना अच्छा होगा


2

<a href="#" class="arrow">इसके बजाय करने की कोशिश करें । (तेज #चरित्र पर ध्यान दें )।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.