सर्वश्रेष्ठ अभ्यास: पहचानकर्ता के रूप में कक्षा या डेटा विशेषता

Question

हाल ही में मैं सोच रहा हूं कि जाने के लिए सबसे अच्छा तरीका क्या है कई तत्वों पर जावास्क्रिप्ट क्रियाएं करना।

• या तो मैं अपने तत्व है, जो अनिवार्य रूप से किसी भी मौजूदा सीएसएस नियमों के अनुरूप नहीं है करने के लिए एक सीएसएस वर्ग को जोड़ने: <div class="validation-required"></div>
• या मैं एक का उपयोग

  तरह से मैं इसे देख 2 संभावनाएं देखते हैं इसलिए जैसे डेटा-विशेषता: <div data-validation-required></div>

मेरी आईडीई में (दृश्य स्टूडियो आर # का उपयोग कर 2012), अगर मैं पहली विधि का उपयोग, मैं एक चेतावनी कह रहा सीएसएस-वर्ग है जो परिभाषित नहीं कर रहे हैं उपयोग नहीं करना चाहिए मिलता है । जो मुझे विश्वास दिलाता है कि यह वैसे भी सबसे अच्छा विचार नहीं हो सकता है। हालांकि, यह वह तरीका है जिसे मैंने अक्सर इस्तेमाल किया है, हालांकि डेटा-एट्रिब्यूट का उपयोग करने से पहले यह केवल कुछ दिनों से अवशेष हो सकता है।

तो मेरा प्रश्न बहुत आसान है, मुझे आगे प्रसंस्करण के लिए एक तत्व को "टैग" करने के लिए किस तरह जाना चाहिए?

कोई जवाब

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

पीपीएस: मैंने इस मामले पर एक खोज की है, लेकिन अधिकांश प्रश्न प्रदर्शन के बारे में हैं, जो एक-ऑफ स्थितियों के लिए मेरी प्राथमिक चिंता नहीं है।

Answer 1

के बारे में लिखा गया है W3C के अनुसार

data- *

कस्टम डेटा विशेषताओं पेज या आवेदन करने के लिए निजी कस्टम डेटा है, जो वहाँ के लिए स्टोर करने के लिए करना है कोई और उपयुक्त गुण या तत्व नहीं हैं। ये विशेषताएँ सॉफ़्टवेयर द्वारा उपयोग के लिए लक्षित नहीं हैं जो गुणों का उपयोग करने वाली साइट से स्वतंत्र है।

class

वर्ग विशेषता HTML में कई भूमिकाओं है: एक शैली पत्रक चयनकर्ता के रूप में (एक लेखक तत्वों का एक सेट करने के लिए शैली जानकारी आवंटित करने के लिए चाहता है जब)। उपयोगकर्ता एजेंटों द्वारा सामान्य उद्देश्य प्रसंस्करण के लिए।

आप class विशेषता का उपयोग करते हैं, तो आप देशी getElementsByClassName खोज और, टॉगल जोड़ने और वर्ग को हटाने के लिएclassList वस्तु से लाभ उठा सकते। getElementsByAttributeValue जैसी कोई बात नहीं है, आपको फिर से शुरू करने की आवश्यकता है। _{देखें ओलिवर मोरन की टिप्पणी}

दूसरी ओर, यदि आप एक से अधिक डाटा स्टोर करने की जरूरत है, तो आप dataset attribute उपयोग कर सकते हैं।

तो यदि आप खोजना चाहते हैं या डेटा तत्व के रूप को प्रभावित करते हैं, तो मैं class का उपयोग करूंगा। यदि आपको एकाधिक डेटा स्टोर करने की आवश्यकता है, तो data अधिक उपयुक्त होगा।

Answer 2

आप केवल कम्प्यूटेशनल प्रयोजनों के लिए डोम तत्वों के लिए "मूल्यों" संबद्ध करने के लिए तो data-attribute के बाद से जाने का रास्ता है चाहते हैं,

कुछ भी है कि कि "डेटा-" निजी के लिए एक भंडारण क्षेत्र के रूप में माना जाएगा डेटा (अर्थ में निजी कि अंत उपयोगकर्ता इसे देख नहीं सकते - यह नहीं है लेआउट या प्रस्तुति को प्रभावित)

इसके अलावा, jQuery .data() प्रदान करता है, जो जीवन में आता है आसान तो आप की जरूरत नहीं हैका उपयोग करने में परेशानीचयनकर्ता।

यदि आप कक्षा नाम प्रदान कर रहे हैं तो अर्थशास्त्र पर विचार करते हुए, इसमें कुछ शैली शामिल होनी चाहिए।

जॉन Resig data-attributes

Answer 3

इस सवाल के भविष्य के दर्शकों के लिए:

चश्मा कस्टम डेटा तत्वों के उपयोग के लिए - और उदाहरण उपयोग - यहां दिए गए हैं: इन बातों को करने के लिए है परीक्षण करने के लिए

W3 spec on embedding custom non visible data with the data attribute

Answer 4

सबसे अच्छा तरीका है http://jsperf.com/id-vs-class-vs-data-attribute

: jsperf.com

यहाँ पर टेस्ट स्वीट के लिए खोज एक आप में रुचि रखते हैं है

कक्षाओं का उपयोग करने के लिए सबसे कुशल चयनकर्ता है।

शायद यह चयन के लिए अधिक कक्षाओं का उपयोग किया जा रहा है, तो ब्राउज़र अधिक अनुकूलित करेंगे?