छिपी हुई विशेषता (HTML5) और प्रदर्शन के बीच अंतर क्या है: कोई भी नियम (CSS) नहीं?


111

HTML5 में एक नई वैश्विक विशेषता है hidden, जिसका उपयोग सामग्री को छिपाने के लिए किया जा सकता है।

<article hidden>
   <h2>Article #1</h2>
   <p>Lorem ipsum ...</p>
</article>

CSS में display:noneनियम है, जिसका उपयोग सामग्री को छिपाने के लिए भी किया जा सकता है।

article { display:none; }

नेत्रहीन, वे समान हैं। शब्दार्थ क्या है? Computationally?

एक या दूसरे का उपयोग करने के लिए मुझे किन दिशानिर्देशों पर विचार करना चाहिए?

TIA।

EDIT : @ newtron की प्रतिक्रियाओं (नीचे) के आधार पर, मैंने और खोज की। इस hiddenविशेषता को पिछले साल बहुत ही लड़ी गई थी और (जाहिरा तौर पर) इसे बमुश्किल ही HTML5 कल्पना में बनाया गया था। कुछ ने तर्क दिया कि यह बेमानी था और इसका कोई उद्देश्य नहीं था। मैं जो बता सकता हूं, उससे अंतिम मूल्यांकन यह है: यदि मैं केवल वेब ब्राउज़र को लक्षित कर रहा हूं, तो कोई अंतर नहीं है। (एक पृष्ठ ने यह भी बताया कि वेब ब्राउज़र display:noneछिपी हुई विशेषता को कार्यान्वित करने के लिए उपयोग करते थे।) लेकिन अगर मैं पहुंच-योग्यता पर विचार कर रहा हूं (उदाहरण के लिए, शायद मुझे उम्मीद है कि मेरी सामग्री को स्क्रीन-रीडर्स द्वारा पढ़ा जा सकता है), तो एक अंतर है। CSS नियम display:noneमेरी सामग्री को वेब ब्राउज़रों से छिपा सकता है, लेकिन इसी aria नियम (जैसे,aria-hidden="false") इसे पढ़ने का प्रयास कर सकता है। इस प्रकार, अब मैं मानता हूं कि @ न्यूट्रॉन का उत्तर सही है, हालांकि शायद (यकीनन) उतना स्पष्ट नहीं है जितना मुझे पसंद हो। आपकी मदद के लिए धन्यवाद @newtron।


5
यह भी नहीं पता है कि hiddenविशेषता मौजूद है, लेकिन निश्चित रूप से एक अच्छा सवाल है क्योंकि यह संरचना / प्रस्तुति अलगाव का उल्लंघन करता है।
१०:१३ पर वाल्डेन्ज़

जिन लोगों ने अभी तक इस विशेषता पर HTML5 युक्ति पढ़ने का आनंद नहीं लिया है: w3.org/TR/html5/editing.html#the-hidden-attribute
james.garriss


पहले से ही पढ़ें, @Yigit। यह भी एक साल से अधिक पुराना है। और छिपी अभी भी कल्पना में है। यह मुझे संकेत देगा कि प्रस्ताव ने कोई धर्मान्तरित नहीं जीता है।
james.garriss

संपादन के लिए धन्यवाद। क्षमा करें यह स्पष्ट नहीं था! आपके द्वारा ऊपर जोड़ी गई जानकारी बहुत अच्छी है। +1
न्यूट्रॉन

जवाबों:


64

मुख्य अंतर यह लगता है कि hiddenतत्व हमेशा प्रस्तुति की परवाह किए बिना छिपे हुए हैं:

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

http://dev.w3.org/html5/spec/Overview.html#the-hidden-attribute

चूंकि सीएसएस विभिन्न मीडिया / प्रस्तुति प्रकारों को लक्षित कर सकता है, display: noneएक दिए गए प्रस्तुति पर निर्भर करेगा। जैसे कुछ तत्व display: noneडेस्कटॉप ब्राउज़र में देखे जा सकते हैं , लेकिन मोबाइल ब्राउज़र नहीं। या, नेत्रहीन रूप से छिपे रहें लेकिन फिर भी स्क्रीन-रीडर के लिए उपलब्ध हैं।


1
तो आप कह रहे हैं कि छिपे हुए ट्रम्प डिस्प्ले? यदि हां, तो आप कह रहे हैं कि इसका उद्देश्य केवल प्रस्तुति को ओवरराइड करना है। हममम।
james.garriss

1
मेरा अनुमान है कि, हाँ, छिपे हुए ट्रम्प प्रदर्शन। लेकिन, मैं वास्तव में इसके साथ प्रयोग नहीं किया है। यदि सीएसएस इसे ओवरराइड कर सकता है, तो यह व्यर्थ प्रतीत होगा।
न्यूट्रॉन

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

6
डेवलपर के अनुसार यहां कुछ टिप्पणियों (@ james-garris, @newtron) से संबंधित, डेवलपर. mozilla.org/en-US/docs/Web/HTML/Global_attributes/… के अनुसार , वास्तव में छिपे हुए ट्रम्प को प्रदर्शित करें - आकृति आंकड़ा :-)
जर्को गोस्पोडनेटिक

2
एक महत्वपूर्ण अंतर जिसे मैंने MDN पेज पर छिपी हुई विशेषता के लिए देखा था: "सीएसएस प्रदर्शन संपत्ति के मूल्य को छिपी हुई विशेषता के साथ एक तत्व पर व्यवहार को ओवरराइड करता है। उदाहरण के लिए, तत्व स्टाइल प्रदर्शन: फ्लेक्स को छिपे हुए विशेषता की उपस्थिति के बावजूद प्रदर्शित किया जाएगा।"
मोहसिनुलहक
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.