क्या यह कभी भी एचटीएमएल पेज में एकाधिक आईडी रखने के लिए स्वीकार्य है?

Question

स्टैक ओवरफ़्लो पर id बनाम class बनाम कुछ प्रश्न हैं लेकिन ये प्रश्न लगभग हमेशा सीएसएस के संबंध में होते हैं - और आम तौर पर स्वीकार्य उत्तर कक्षाओं का उपयोग तत्वों के एक विशेष समूह को स्टाइल करने के लिए करना है, और विशिष्ट उदाहरणों के लिए आईडी। समझ में आता है, काफी उचित है।

मुझे लगता है कि जैसे ही मैं अधिक से अधिक जावास्क्रिप्ट/jQuery/AJAX करता हूं, वह दृष्टिकोण कम स्पष्ट कट बनना शुरू हो रहा है और मुझे ऐसी स्थितियां मिल रही हैं जहां अर्थात् तत्वों को ids दिया जाना चाहिए, लेकिन क्योंकि वहां हो सकता है कई उदाहरण मुझे कक्षाओं का उपयोग करना चाहिए।

यहाँ मैं क्या मतलब है की एक उदाहरण है:

स्टैक ओवरफ़्लो के markdown प्रश्न संपादक पर उपकरण पट्टी पर एक नजर डालें - प्रत्येक बटन एक आईडी विशिष्ट यह पहचान करने के लिए है। सही समझ में आता है - यह एक बटन है जो एक विशिष्ट कार्य करता है और संभवतः उस आईडी के आधार पर स्क्रिप्ट को लगाया जाता है।

अब कल्पना करें कि मैं एक समृद्ध वेब ऐप बना रहा हूं और एक ऐसा पृष्ठ है जिसमें प्रत्येक पर एक मार्कडाउन संपादक वाला दो टैब हैं। क्या इसका मतलब यह है कि टूलबार बटन अब कक्षा से की पहचान कर रहे हैं?

यह गलत लगता है।

एक और उदाहरण: मैं एक फोटो गैलरी साइट पर काम कर रहा हूं जिसमें प्रत्येक फ़ोटो पर थोड़ा टूलबार ओवरलाइड है। सम्मेलन का कहना है कि क्योंकि इन बटनों के कई उदाहरण हैं मुझे कक्षाओं का उपयोग करना चाहिए। वास्तव में?

तो मेरी सवाल कर रहे हैं ....

• अगर मैं एक पेज पर डुप्लिकेट आईडी की अपराध है, जो ब्राउज़र वास्तव में टूट जाएगा?
• ब्राउज़र के लिए जहां यह ब्रेक करता है, क्या यह केवल सीएसएस स्टाइल है जो टूट जाएगा, या jQuery चयनकर्ता भी तोड़ देंगे।
• क्या वर्णित मामलों में डुप्लिकेट आईडी का उपयोग करना वास्तव में इतना बुरा है।

Answer 1

क्लासेस मतलब एक है ... (अनिश्चितकालीन) आईडी मतलब है ... (निश्चित)

"यह div एक फोटो है टूलबार। ऐसा और भी हो सकता है। " समझ में आता है, मैं एक वर्ग का उपयोग करता हूँ।

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

ब्राउज़र जो स्वीकार करते हैं उनमें काफी लचीला होते हैं, लेकिन इसका मतलब यह नहीं है कि मानकों को तोड़ा जाना चाहिए।

Answer 2

• अगर मैं एक पेज पर डुप्लिकेट आईडी की अपराध है, जो ब्राउज़र वास्तव में टूट जाएगा? एचटीएमएल वैधकर्ता शिकायत करते हैं क्योंकि आईडी विशेषताओं को अद्वितीय, माना जाता है लेकिन बड़े तीन ब्राउज़र इंजन मुझे इससे दूर जाने देते हैं।

• ब्राउज़रों के लिए जहां यह टूटता है, क्या यह केवल सीएसएस स्टाइल है जो टूट जाएगा, या jQuery चयनकर्ता भी तोड़ देंगे। jquery selector अपेक्षित के रूप में काम नहीं कर सकता है या नहीं। क्योंकि यह अद्वितीय

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

Answer 3

आप दो बटन है, तो आप उन्हें पहचान करने के लिए दो अलग-अलग आईडी होना चाहिए ।आप उन्हें शैली कक्षाओं का उपयोग कर सकते हैं, लेकिन दो बटन के लिए एक जावास्क्रिप्ट समारोह का उपयोग करने से रोकने कोई बात नहीं है:

$("#idOne").click(function(){ 
    myClickHandler(this); 
}); 

$("#idTwo").click(function(){ 
    myClickHandler(this); 
}); 

var myClickHandler = function(element){ 
    // element is the DOM Element of the Button that was clicked 
    // Turn it into a jQuery Object: $(element) 
}; 

बेशक

, अपने बटन आम तौर पर कुछ प्रकार के एक TextArea साथ सूचना का आदान, और दो textareas होना चाहिए अलग-अलग आईडी क्योंकि तब आप सिर्फ यह कर सकते हैं:

$("#idOne").click(function(){ 
    myClickHandler(this,"idOfTextArea1"); 
}); 

$("#idTwo").click(function(){ 
    myClickHandler(this,"idOfTextArea2"); 
}); 

var myClickHandler = function(element, textAreaId){ 
    var ta = $("#"+textAreaId); 
    // Do something with the textarea 
} 

Answer 4

ऐसा मत करो।

ऐसा नहीं है कि ब्राउज़रों टूट जाएगा नहीं है, यह लिपियों कि टूट जाएगा है। jQuery, .getElementById का उपयोग कर कुछ भी,

किसी बिंदु पर किसी और को ऐप पर काम करने की आवश्यकता हो सकती है, और मुझे उम्मीद है कि वे डुप्लिकेट आईडी द्वारा तीव्र रूप से क्रोधित होंगे।

Answer 5

मुझे एहसास है कि यह एक काफी पुराना विषय है, लेकिन मैं बस कुछ ऐसी चीज में भाग गया जो प्रासंगिक हो सकता है।

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

भयानक हिस्सा: एक उदाहरण अब दूसरे का पूर्वज था, और शैलियों दोनों के लिए लागू किया जा रहा था, पेज तोड़ दिया।

मेरा पहला प्रयास पर पर मैं $('#theId').attr('id', ''); जोड़ा आईडी दूर करने के लिए, और पाया कि jQuery केवल पहला है, जो दूसरे के एक पूर्वज है से इतना किया था। भले ही यह पहले के साथ बंद हो गया, कोई जेएस त्रुटि नहीं थी।

इसे ध्यान में रखते हुए, जब तक हम सेमी बाहर साफ कर सकते हैं,

$('#theId').addClass('notThisOne'); 

$('.notThisOne #theId').attr('id', '');` 

कि क्या नया (कोई div#theId) या पुराने (div#theId सहित), तोड़ने से पृष्ठों रखेंगे सामग्री सेमी ब्लॉक में है।