क्या मैं डोम ऑब्जेक्ट्स में मनमानी गुण जोड़ सकता हूं?

Question

क्या मैं जावास्क्रिप्ट डीओएम ऑब्जेक्ट्स जैसे <INPUT> या <SELECT> तत्वों के लिए मनमाना गुण जोड़ सकता हूं? या, अगर मैं ऐसा नहीं कर सकता, तो क्या संदर्भ वस्तु के माध्यम से पेज तत्वों के साथ अपनी खुद की वस्तुओं को जोड़ने का कोई तरीका है?

Answer 1

निश्चित रूप से, लोग उम्र के लिए ऐसा कर रहे हैं। यह अनुशंसित नहीं है क्योंकि यह गन्दा है और आप मौजूदा गुणों के साथ गड़बड़ कर सकते हैं।

यदि आप for..in के साथ कोड लूप कर रहे हैं तो आपका कोड तोड़ सकता है क्योंकि अब आप इन नए संलग्न गुणों के माध्यम से गणना कर रहे हैं।

मैं jQuery का .data जैसे कुछ का उपयोग करने का सुझाव देता हूं जो वस्तुओं से जुड़े मेटाडेटा को रखता है। यदि आप लाइब्रेरी का उपयोग नहीं करना चाहते हैं, तो jQuery.data

Answer 2

हां, आप डीओएम ऑब्जेक्ट्स में अपनी खुद की संपत्तियां जोड़ सकते हैं, लेकिन टकराव और परिपत्र संदर्भों का नाम देने से बचने के लिए सावधानी बरतें। data- विशेषता उपसर्ग का उपयोग करके -

document.getElementById("myElement").myProperty = "my value"; 

एचटीएमएल 5 मार्कअप के माध्यम से तत्वों को डेटा संलग्न की एक मान्य तरीका पेश किया। आप 4 दस्तावेजों कोई मुद्दों के साथ भी HTML में इस विधि का उपयोग कर सकते हैं, लेकिन वे मान्य नहीं होगा:

<div id="myElement" data-myproperty="my value"></div> 

जो तुम जावास्क्रिप्ट के माध्यम से उपयोग कर सकते हैं getAttribute() का उपयोग कर:

document.getElementById("myElement").getAttribute("data-myproperty"); 

Answer 3

आप के लिए गुण जोड़ना चाहते हैं ऑब्जेक्ट, या तत्व के लिए गुण?

आप setAttribute

var el = document.getElementById('myelement'); 
el.setAttribute('custom', 'value'); 

का उपयोग कर गुण जोड़ सकते हैं या यदि आप बस जावास्क्रिप्ट ऑब्जेक्ट में गुण जोड़ सकते हैं:

var el = document.getElementById('myelement'); 
el.myProperty = 'myValue'; 

Answer 4

आप मानक HTML विशेषताओं का उपयोग नहीं करते चाहिए। यहाँ कस्टम विशेषताओं का उपयोग करने पर एक ट्यूटोरियल है:

http://www.javascriptkit.com/dhtmltutors/customattributes.shtml

यह एचटीएमएल 5 है, लेकिन यह पार्श्व-संगत है।

Answer 5

यदि कोई 2015 में सोच रहा है, तो आप कर सकते हैं - और jQuery data में ऐसा कर रहा है। बस भावी उपसर्ग नाम जैसे विक्रेता उपसर्ग या समय-आधारित यादृच्छिक प्रत्यय (jQuery) चुनें।