मैं जावास्क्रिप्ट ऑब्जेक्ट प्रॉपर्टी को हाइफ़न के साथ कैसे संदर्भित करूं?

Question

सभी विरासत आदि शैलियों की शैली वस्तु बनाने के लिए this script का उपयोग करना।

var style = css($(this)); 
alert (style.width); 
alert (style.text-align); 

निम्नलिखित के साथ, पहले चेतावनी ठीक काम करेंगे, लेकिन दूसरा एक नहीं है .. यह एक शून्य से मुझे लगता है .. डिबगर कहते हैं, 'ध्यान में न आया संदर्भ त्रुटि' के रूप में - की व्याख्या है। मैं इसके चारों ओर उद्धरण नहीं डाल सकता, हालांकि, क्योंकि यह एक स्ट्रिंग नहीं है। तो मैं इस ऑब्जेक्ट प्रॉपर्टी का उपयोग कैसे करूं?

Answer 1

संपादित

देखो आप सीएसएस गुण कुंजी संकेतन गुण की संख्या के साथ संगत नहीं है के लिए है कि देखेंगे। ऊंट मामले कुंजी अंकन इसलिए का उपयोग करते हुए वर्तमान रास्ता

obj.style-attr // would become 

obj["styleAttr"] 

---

उपयोग कुंजी के बजाय अंकन डॉट

style["text-align"] 

सभी सरणियों में js वस्तुओं रहे हैं और सभी वस्तुओं को सिर्फ साहचर्य सरणियों, इस साधन हैं है आप ऑब्जेक्ट में किसी स्थान को संदर्भित कर सकते हैं जैसे आप किसी सरणी में एक कुंजी का संदर्भ लेंगे।

arr[0] 

या वस्तु जब गुण इस तरह

1. वे ऐसा मूल्यांकन किया जाता है तार जब तक आप एक काउंटर के साथ कुछ कर रहे हैं या का उपयोग कर का उपयोग तक पहुँचने

   obj["method"] == obj.method 
   

   नीचे दिए कुछ याद करने के लिए गतिशील विधि नाम।

   इसका मतलब यह है obj [विधि] जबकि obj [ "विधि"] नहीं

2. यदि आप अक्षर हैं जो js चर में अनुमति नहीं है का उपयोग कर रहे इस अंकन का उपयोग करना चाहिए होता है कि आप एक अपरिभाषित त्रुटि देना होगा।

इस regex काफी रकम इसे

[a-zA-Z_$][0-9a-zA-Z_$]* 

Answer 2

उपयोग कोष्ठक: वस्तुओं पर

var notTheFlippingStyleObject = { 
    'a-b': 1 
}; 

console.log(notTheFlippingStyleObject["a-b"] === 1); // true 

और जानकारी: MDN

नोट: यदि आप एक्सेस कर रहे हैं style वस्तु, CSSStyleDeclaration, उपयोग जावास्क्रिप्ट से उस तक पहुंच CamelCase चाहिए। टिप्पणियों पर अधिक जानकारी here

Answer 3

सीधे सवाल का जवाब करने के लिए: style['text-align'] आप इसे कैसे में हाइफ़न से एक संपत्ति संदर्भ होता है। लेकिन style.textAlign (या style['textAlign']) इस मामले में क्या उपयोग किया जाना चाहिए।

Answer 4

- के साथ सीएसएस गुण जावास्क्रिप्ट ऑब्जेक्ट्स में ऊंटकेस में दर्शाए जाते हैं।यही कारण है कि होगा:

alert(style.textAlign); 

तुम भी स्ट्रिंग का उपयोग करने के लिए एक ब्रैकेट अंकन इस्तेमाल कर सकते हैं:

alert(style['text-align']); 

संपत्ति के नाम केवल अक्षर, संख्या, अच्छी तरह से ज्ञात $ संकेत और _ (करने के लिए धन्यवाद हो सकती है pimvdb)।

Answer 5

ऑब्जेक्ट प्रॉपर्टी नाम सीएसएस नामों के लिए एक-एक-एक मैच नहीं हैं।

Answer 6

हाइफेनेटेड शैली गुण referenced via camelCase in JavaScript हैं, इसलिए style.textAlign का उपयोग करें।

Answer 7

मूल सवाल का जवाब है: उद्धरण में जगह संपत्ति नाम और सरणी शैली अनुक्रमण का उपयोग करें:

obj['property-with-hyphens']; 

कई ने बताया है कि संपत्ति आप में रुचि रखते हैं एक सीएसएस संपत्ति है। सीपीयू गुण जो हाइफ़न हैं स्वचालित रूप से ऊंट आवरण में परिवर्तित हो जाते हैं।

style.textAlign; 

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

obj['a-b'] = 2; 
alert(obj.aB);   // undefined 
alert(obj['a-b']);  // 2 

Answer 8

आपकी समस्या को हल करने के लिए: उन में हाइफ़न के साथ सीएसएस गुण represented by JavaScript properties in camelCase हैं इस समस्या से बचने के लिए। आप चाहते हैं: style.textAlign। उपयोग square bracket notation:

सवाल उत्तर देने के लिए के रूप में obj["prop"] ताकि आप तार का उपयोग कर संपत्ति के नाम का उपयोग और अक्षर हैं जो पहचानकर्ता में इनकार किया जाता का उपयोग कर सकते obj.prop में ही है।

Answer 9

alert(style.textAlign) 

या

alert(style["textAlign"]); 

Answer 10

मैं सीएसएस शैलियों वे जावास्क्रिप्ट में CamelCase को बदल जाओ तो test-aligntextAlign हो जाता है के मामले में लगता है। सामान्य स्थिति में जहां आप ऐसी संपत्ति तक पहुंचना चाहते हैं जिसमें गैर-मानक वर्ण हैं, आप सरणी शैली का उपयोग करते हैं। ['text-align']

Answer 11

सबसे पहले, मुझे आश्चर्य है कि क्यों समाधान मेरी अंत

api['data-sitekey'] //returns undefined 

पर काम नहीं किया ... बाद में पता लगाने कि डेटा तक पहुँचने का श्रेय पर अलग है: यह इस तरह होना चाहिए:

var api = document.getElementById("some-api"); 
api.dataset.sitekey 

आशा है कि इससे मदद मिलती है!