2011-12-08 11 views
11

तो मैं डोम में हेरफेर करने सीख रहा हूँ और मैं एक दिलचस्प बात यह देखा:जावास्क्रिप्ट: setAttribute() vs.s. element.attribute = मान सेट करने के लिए "नाम" विशेषता

चलो कहते हैं कि मैं का उपयोग करके एक तत्व की name विशेषता निर्धारित करना चाहते हैं "। " डॉट नोटेशन:

element.name = "someName"; 
console.log(document.getElementsByName("someName")[0]); // returns "undefined"?? 

लेकिन अगर मैं document.setAttribute() विधि का उपयोग करें, यह ठीक काम करता है:

element.setAttribute("name", "someName"); 
console.log(document.getElementsByName("someName")[0]); // returns the element like it should. 

सुनिश्चित नहीं हैं कि क्यों डॉट नोटेशन विधि पहले मामले में काम नहीं करता।

ऐसा क्यों होता है?

+0

आम तौर पर 'getElementsByName' – zzzzBov

+1

का उपयोग करने से बचने का प्रयास करें क्यों कोई getElementsByName का उपयोग करने से बचें? –

+0

विशेषताएँ डॉट नोटेशन का उपयोग करके सुलभ हैं यदि आप उन्हें कैसे एक्सेस करना चाहते हैं। यदि आप डॉट नोटेशन का उपयोग करके विशेषताओं तक पहुंच बनाना चाहते हैं तो आपको इसके मूल्य को कुशल बनाने के लिए विशेषता और obj.attributes.attributeName.value को पुनर्प्राप्त करने के लिए obj.attributes.attributeName को संदर्भित करने की आवश्यकता है। SetAttribute या getAttribute की तुलना में यह लंबे समय तक घुमाया जाता है। और समाधान के रूप में अनुशंसित नहीं है, लेकिन इसके बावजूद, आपके प्रश्न का पूर्ण जवाब "पहले मामले में नोटेशन डॉट क्यों नहीं करता है" - इसमें शामिल होना है "यह करता है। आप केवल विशेषताओं के लिए गलत जगह देख रहे थे और उनके मूल्य। " – Radiotrib

उत्तर

11

मेरा अनुमान है (क्योंकि आपने तत्व प्रकार निर्दिष्ट नहीं किया है) तत्व सामान्य रूप से name विशेषता नहीं है, इसलिए उस तरह की DOM प्रॉपर्टी को सेट करना काम नहीं करेगा।

उदाहरण के लिए, input तत्व पर name संपत्ति सेट करना काम करेगा। इसे div पर सेट करना नहीं होगा।

हालांकि, यह setAttribute() के साथ काम करेगा।

jsFiddle

+0

सर जब मैंने कुछ HTML तत्व विशेषता को "अपरिभाषित" के रूप में सेट किया है, तो यह काम नहीं करता है, और यह अपने पिछले मानों को जारी रखता है। क्या आप मुझे बता सकते हैं ऐसा क्यों है? –

0

जब आप इसका उपयोग करते हैं, element.name, आप संपत्ति का उपयोग कर रहे हैं/नाम "नाम" नामक संपत्ति बना रहे हैं और इसके मूल्य को सेट कर रहे हैं।

लेकिन,

का उपयोग करते समय, element.setAttribute ('नाम', 'SomeName'), आप वास्तव में विशेषता 'नाम' की स्थापना कर रहे हैं।

आईई 8 और नीचे संपत्ति और विशेषता का व्यवहार करता है, बग आईई 9 और उसके बाद में तय किया गया है।
सफारी, फ़ायरफ़ॉक्स, क्रोम संपत्ति का गुण और विशेषता अलग-अलग।

हालांकि, यदि आप ऐसा करना चाहते हैं तो आप हमेशा अपनी पसंद की एक नई संपत्ति बना सकते हैं।

+1

आंशिक उत्तर ... सीमित और समस्या के पीछे तर्क की व्याख्या नहीं करता – Radiotrib

4

दूसरों के कुछ लोगों द्वारा प्रदान की जवाब का विस्तार करने के लिए ...

विशेषता 'नाम' केवल कुछ विशिष्ट वस्तुओं के लिए मान्य डोम माना जाता है। https://developer.mozilla.org/en-US/docs/DOM/element.name के अनुसार उन वस्तुओं हैं:

<a>, <applet>, <button>, <form>, <frame>, <iframe>, <img>, <input>, 
<map>, <meta>, <object>, <param>, <select>, and <textarea> 

इन वस्तुओं आप सेट कर सकते हैं मिलता है और नाम विशेषता object.name का उपयोग कर बदल बल्कि किसी भी अन्य डोम ऑब्जेक्ट विशेषता 'नाम' के लिए एक कस्टम विशेषता है और SetAttribute() का उपयोग कर बनाया जाना चाहिए के लिए या इसे HTML घोषणा में जोड़कर। एक बार यह बनने के बाद, आप setAttribute() और getAttribute() का उपयोग करके इसे प्राप्त कर सकते हैं या आप object.attributes.name.value का उपयोग करके सीधे इसके मान का संदर्भ ले सकते हैं उदाहरण के लिए http://jsfiddle.net/radiotrib/yat72/1/ पर एक नज़र डालें। Btw - लोड पर चेतावनी बॉक्स जानबूझकर है - क्यों देखने के लिए कोड की जाँच करें ...

0
<head> 
<script> 
function test($count) { 
document.getElementById("test1").setAttribute("name","file-upload_" + $count); 
} 
</script> 
</head> 
<body> 

<p>some content</p> 
<input id="test1" type="file" name="file-upload" id="file-upload" /> 
<p>some other content</p> 
<script>test(1);</script> 
</body> 
2

(ऊपर पोस्ट के भाग की व्याख्या करने के प्रयास कर रहा है एक बेहतर, अलग है, क्योंकि यह पहले से ही -ve रेटिंग में चला गया है, और उस पद में विश्वास कम होगा। इसे और सुधारने में सहायता करें।)

*** अपने मूल्य property

जब आप का उपयोग करें, element.name, आप एक मौजूदा property नाम "नाम" तक पहुँच रहे हैं या सेटिंग।

Example 1: 
var div1 = document.getElementById("div1"); 
div1.textContent = "2"; 

*** attribute

लेकिन, का उपयोग करते समय, element.setAttribute('name','someName'), आप वास्तव में attribute नामित 'नाम' की स्थापना कर रहे हैं। यह विशेषता किसी मौजूदा प्रॉपर्टी भी

Example 2: 
var h1 = document.getElementById("H1"); 
h1.setAttribute("class", "democlass"); 

Example 3: 
var d = document.getElementById("d1"); 
d.setAttribute("name1", "value1"); 
1

जब आप का उपयोग करें, element.name, आप संपत्ति/एक्सेस कर रहे हैं एक संपत्ति "नाम" नाम बनाने और अपने मूल्य की स्थापना हो सकती है।