एचटीएमएल 5 विनिर्देश लगभग किसी भी आईडी विशेषता मूल्य की अनुमति देता है - बुद्धिमानी से उपयोग करें

जैसा कि मैंने कुछ समय पहले " सही आईडी बनाना " लेख में उल्लेख किया था, HTML 4.01 मान्य आईडी विशेषता मानों के मामले में काफी सीमित है:

ID और NAME विशेषताओं को एक अक्षर ([A-Za-z]) से शुरू होना चाहिए, इसके बाद किसी भी संख्या में अक्षर, संख्याएं ([0-9]), हाइफ़न ("-"), अंडरस्कोर ("_"), कॉलन (":") और अवधि ("।")।

HTML5 लगभग किसी भी आईडी विशेषता मान के उपयोग की अनुमति देता है:

आईडी विशेषता के बारे में HTML5 विनिर्देश 3.2.3.1 :

यह मान तत्व वाले ट्री के अन्य सभी ID मानों के सापेक्ष अद्वितीय होना चाहिए और इसमें कम से कम एक वर्ण होना चाहिए। मान में रिक्त स्थान नहीं होना चाहिए।

कम से कम एक वर्ण, कोई स्थान नहीं।



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



निम्नलिखित HTML कोड पर विचार करें:

<div id="#id"></div> <div id="div>p+p:first-child"></div>
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

CSS चयनकर्ता संघर्ष करता है

CSS का उपयोग करके उपरोक्त तत्वों को एक्सेस करने के लिए, सामान्य सिंटैक्स का उपयोग करना विफल होगा:

 ##id {} #div>p+p:first-child {}
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

चूँकि id में एक वर्ण होता है, जिसके लिए CSS में पूर्वनिर्धारित मूल्य होता है, इसलिए आपको उन्हें काम करने के लिए CSS चयनकर्ताओं को थोड़ा आकर्षित करने की आवश्यकता होगी। एक तरीका यह है कि चयनकर्ता का उपयोग विशेषता मान द्वारा किया जाए, बजाय #:

 [id="#id"] {} [id="div>p+p:first-child"] {}
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

एक अन्य तरीका संघर्ष पैदा करने वाले पात्रों से बचना है:

 #\#id {} #div\>p\+p\:first-child {}
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

जावास्क्रिप्ट मुद्दों

यदि आप हमारे तत्वों पर काम करने के लिए jQuery की तरह एक जावास्क्रिप्ट पुस्तकालय का उपयोग करते हैं, तो यह कठिनाइयों का कारण होगा:

 $("#div>p+p:first-child").css("fontSize", "2em");
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

CSS के साथ की तरह, आपको विशेष वर्णों से बचना होगा:

 $("#div\\>p\\+p\\:first-child").css("fontSize", "2em");
      
      

        
        
        
      

    
        
        
        
      
      

        
        
        
      

    
     

तत्वों के सार्थक नामकरण

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