सर्वोत्तम प्रैक्टिस: HTML आईडी या नाम विशेषता के द्वारा एक्सेस फॉर्म एलिमेंट्स?


136

जैसा कि किसी भी अनुभवी जावास्क्रिप्ट डेवलपर को पता है, एक ही काम करने के कई (बहुत सारे) तरीके हैं। उदाहरण के लिए, मान लें कि आपके पास एक टेक्स्ट फ़ील्ड निम्नानुसार है:

<form name="myForm">  
    <input type="text" name="foo" id="foo" />

जावास्क्रिप्ट में इसे एक्सेस करने के कई तरीके हैं:

[1]  document.forms[0].elements[0];
[2]  document.myForm.foo;
[3]  document.getElementById('foo');
[4]  document.getElementById('myForm').foo;
     ... and so on ...

तरीके [1] और [३] मोजिला गेको दस्तावेज में अच्छी तरह से प्रलेखित हैं, लेकिन न तो आदर्श हैं। [१] उपयोगी होने के लिए बस सामान्य है और [३] दोनों के लिए एक आईडी और एक नाम की आवश्यकता होती है (यह मानते हुए कि आप सर्वर साइड भाषा में डेटा पोस्ट करेंगे)। आदर्श रूप से, केवल आईडी विशेषता या नाम विशेषता होना सबसे अच्छा होगा (दोनों कुछ हद तक बेमानी हैं, खासकर यदि आईडी किसी भी सीएसएस के लिए आवश्यक नहीं है, और टाइपोस, आदि की संभावना बढ़ जाती है)।

] जितना संभव हो मानकों का अनुपालन)।

तो यहां सबसे अच्छा अभ्यास क्या है? क्या कोई डोम प्रलेखन या W3C विनिर्देशन में कुछ को इंगित कर सकता है जो इसे हल कर सकता है?

नोट मुझे विशेष रूप से गैर-पुस्तकालय समाधान (jQuery / प्रोटोटाइप) में दिलचस्पी है।


मुझे लगता है कि यह किस चीज को उबालता है, मैं सबसे अधिक मानकों की तलाश कर रहा हूं, जो नाम विशेषता का उपयोग करते हुए एक फार्म तत्व का उपयोग करने के लिए अनुकूल तरीका है ...
seth

4
"दोनों कुछ हद तक बेमानी हैं, खासकर अगर आईडी किसी भी सीएसएस के लिए आवश्यक नहीं है, और टाइपोस की संभावना बढ़ जाती है" - आईडी लेबल के प्रभावी उपयोग के लिए आवश्यक है। सीएसएस ही नहीं।

कभी-कभी एक वेबपेज पर कई रूप होते हैं और आईडी विशेषताएँ टकरा सकती हैं।
कैलमरीस

जवाबों:


96

अपने फॉर्म को केवल एक आईडी दें , और आपके इनपुट को केवल एक नाम दें :

<form id="myform">
  <input type="text" name="foo">

तब आपके इनपुट तत्व तक पहुंचने के लिए सबसे अधिक मानक-अनुपालन और कम से कम समस्याग्रस्त तरीका है:

document.getElementById("myform").elements["foo"]

.elements["foo"]सिर्फ इसके बजाय का उपयोग करना .fooबेहतर है क्योंकि उत्तरार्द्ध HTML तत्व के बजाय "फू" नाम के फॉर्म की संपत्ति लौटा सकता है!


1
@ कार्ल ... आप क्या हासिल करने की कोशिश कर रहे हैं? इस तथ्य के अलावा कि आपके HTML में JS को इनलाइन करना असाध्य है (और अक्सर अक्षम है, क्योंकि यह कोड के चारों ओर एक आवरण फ़ंक्शन बनाता है), इस तथ्य को कि आप हमेशा गलत तरीके से लौटते हैं, आपका फॉर्म कभी भी सबमिट नहीं होगा। इसलिए जब तक कि फॉर्म जमा नहीं किया जाता है (शायद यह पूरी तरह से जेएस कोड द्वारा उपयोग किया जाता है), या जब तक myFunc (यह) इसे AJAX के माध्यम से प्रस्तुत नहीं करता है (और आप AJAX के मामले में वापसी के रूप में एक नियमित जमा करने के बारे में परवाह नहीं करते हैं किसी भी तरह से विफल रहता है), ... तो आप एक गलती की है।
Doin'

1
आम तौर पर, केवल मान्य फ़ॉर्म डेटा सबमिट करने के लिए, आप ऐसा करेंगे: myform.onsubmit = validateForm;(जहाँ myform एक वैरिएबल है, जो फॉर्म एलिमेंट को संदर्भित करता है, और वेरिफ़ॉर्म आपके सत्यापन फ़ंक्शन का नाम है ... लेकिन आप इसे myFunc नाम दे सकते हैं यदि आप वास्तव में , वास्तव में चाहते हैं )। महत्वपूर्ण बिंदु यह है कि जब भी फॉर्म वैध नहीं हो, तब तक गलतvalidateForm() लौटना चाहिए , साथ ही उपयोगकर्ता को समस्या क्षेत्र (एस) का संकेत देना चाहिए। प्रपत्र डेटा सही ढंग से मान्य होने पर इसे सही लौटना चाहिए , जो सबमिट क्रिया को आगे बढ़ने की अनुमति देगा।
Doin'

2
प्रपत्र फ़ील्ड में आईडी से बचने का एक और कारण है: यदि आप एक ही फॉर्म के (एक ही पृष्ठ में) एक से अधिक इंस्टेंसेस चाहते हैं।
धनिया

1
@ जोओ भी काम करता है, बशर्ते "फू" एक जावास्क्रिप्ट संपत्ति के नाम के रूप में मान्य हो। (यह नहीं हो सकता है - एचटीएमएल 5 स्थानों में nameविशेषता के मूल्य पर लगभग कोई प्रतिबंध नहीं है , इसलिए जैसे आपके पास हो सकता है <select name="a+b">या <input type="text" name="...2">, जिसे जावास्क्रिप्ट (.propertyName संकेतन) का उपयोग करके संदर्भित नहीं किया जा सकता है। स्पष्ट [] संकेतन भी उदाहरणों से निर्मित नामों की अनुमति देता है, जैसे myCheckBox = document.getElementById("myform").elements["CHK"+i]। इसके अलावा, शैलीगत रूप से, मुझे लगता है कि यह बेहतर है - यह स्पष्ट करता है कि ये एक जावास्क्रिप्ट ऑब्जेक्ट के सिर्फ गुण नहीं हैं। YMMV।
चल रहा

1
लाइनिंग के बारे में, ध्यान रखें कि लाइनिंग केवल एक स्टाइल गाइड है, और एक लाइनिंग "त्रुटि" का मतलब यह नहीं है कि आपकी जावास्क्रिप्ट अमान्य या गलत है। इस विशेष मामले में, हालांकि, लिनेटिंग नियम जो कह रहा है वह "जावास्क्रिप्ट ऑब्जेक्ट प्रॉपर्टीज को संदर्भित करते समय डॉट नोटेशन पसंद करता है"। यह एक अच्छा विचार है, और मैं सामान्य रूप से सलाह देता हूं। लेकिन , जबकि लिंटर को यह एहसास नहीं है, elementsएक सामान्य जे एस वस्तु नहीं है, और elements.fooया elements["foo"]वास्तव में elements.namedItem ( "foo") करने के लिए परिवर्तित हो रही है। यानी आप एक जेएस प्रॉपर्टी को संदर्भित नहीं करते हुए एक डीएम-परिभाषित फ़ंक्शन कह रहे हैं!
चल रहा

34

[१] डॉक्यूमेंट.फॉर्म [०];

" नहीं-ओमग-कभी नहीं! " मेरे मन में आता है जब मैं तत्व अभिगम की इस पद्धति को देखता हूं। इसके साथ समस्या यह है कि यह मानता है कि DOM एक सामान्य डेटा संरचना है (जैसे: एक सरणी) जिसमें तत्व क्रम स्थिर, सुसंगत या किसी भी तरह विश्वसनीय है। हम जानते हैं कि 99.9999% समय, कि यह मामला नहीं है। inputफ़ॉर्म के भीतर पुन: व्यवस्थित करना या तत्व, formप्रश्न में फ़ॉर्म से पहले पृष्ठ में एक और जोड़ना या फ़ॉर्म को प्रश्न में स्थानांतरित करना ऐसे सभी मामले हैं जहां यह कोड टूट जाता है। लघुकथा: यह बहुत नाजुक है। जैसे ही आप कुछ जोड़ते हैं या स्थानांतरित करते हैं, यह टूटने वाला है।

[२] डॉक्यूमेंट .myForm.foo;

मैं इस पर सर्गेई ILinsky के साथ हूँ :

  • उनकी idविशेषता का हवाला देकर मनमाने तत्वों तक पहुँच :document.getElementById("myform");
  • उनके मूल तत्व तत्व के सापेक्ष नाम तत्वों का उपयोग करें: document.getElementById("myform").foo;

इस पद्धति के साथ मेरा मुख्य मुद्दा यह है कि nameफॉर्म पर लागू होने पर विशेषता बेकार है। नाम POST / GET के भाग के रूप में सर्वर को नहीं दिया गया है और हैश शैली के बुकमार्क के लिए काम नहीं करता है।

[३] डॉक्यूमेंट.गेटईमेंटबाइय्ड ('फू');

मेरी राय में, यह सबसे बेहतर तरीका है। प्रत्यक्ष पहुंच सबसे संक्षिप्त और स्पष्ट विधि है।

[४] डॉक्यूमेंट.गेटइमेंटमेंटबाय (orm myForm ’)। Foo;

मेरी राय में, यह स्वीकार्य है, लेकिन आवश्यकता से अधिक क्रिया। विधि # 3 बेहतर है।


मैं सिर्फ डगलस क्रॉकफोर्ड के एक वीडियो को देखने के लिए हुआ और उसने इस विषय पर तौला। रुचि का बिंदु -12: 00 है। संक्षेप में:

  • दस्तावेज़ संग्रह (document.anchor, document.form, आदि) अप्रचलित और अप्रासंगिक हैं (विधि 1)।
  • nameविशेषता उन तक पहुँचने के लिए नहीं, चीजों को नाम के लिए प्रयोग किया जाता है। यह विंडोज़, इनपुट फ़ील्ड और एंकर टैग जैसी चीजों के नामकरण के लिए है।
  • "आईडी वह चीज है जिसका उपयोग आपको विशिष्ट रूप से एक तत्व की पहचान करने के लिए करना चाहिए ताकि आप उस तक पहुंच प्राप्त कर सकें। वे (नाम और आईडी) विनिमेय हुआ करते थे, लेकिन वे अब नहीं हैं।"

इसलिए यह अब आपके पास है। शब्दार्थ, यह सबसे अधिक समझ में आता है।


2
तो क्या यह सिर्फ एक हैक है? । document.getElementById ( "MyForm") foo; DOM का थोड़ा अध्ययन करने के बाद, मैं स्पष्ट नहीं हूँ कि यह काम क्यों करता है। मेरा अनुमान है कि फॉर्म ऑब्जेक्ट भी HTML सरणी विशेषता पर अनुक्रमित बाल तत्वों की एक सरणी है ...
seth

1
इसके अलावा आप उल्लेख करते हैं कि "नाम POST / GET के हिस्से के रूप में सर्वर को नहीं दिया गया है और हैश शैली के बुकमार्क के लिए काम नहीं करता है"। क्या यह ठीक नहीं है कि आईएस ने सर्वर को क्या दिया है? जब आप PHP के साथ काम कर रहे होते हैं, तो यह नाम विशेषता है जो कि $ _POST वैश्विक में आपका सूचकांक है।
सेठ

2
@ जस्टिन, यह नाम की विशेषता है जो सर्वर से पास हो जाती है।
अनुराग

2
@seth पुराने डोम स्पेक्स क्यों document.aForm.fooकाम करता है के बारे में बहुत अस्पष्ट लगते हैं , लेकिन HTML5 कल्पना स्पष्ट रूप से एक के इंटरफ़ेस को परिभाषित करने के लिए लगता HTMLFormElementहै caller getter any namedItem(in DOMString name);Whatwg.org/specs/web-apps/current-work/multipage/…
अनुराग

1
@ दोनों लोग: "... नाम विशेषता तब बेकार हो जाती है जब एक फॉर्म पर लागू किया जाता है ..." मैं नाम विशेषता के बारे में बात नहीं कर रहा हूं inputया select, मैं नाम विशेषता के बारे में बात कर रहा हूं form। सर्वर पर नाम की विशेषता को पारित form नहीं किया जाता है।
जस्टिन जॉनसन ने

14

एक रूप में रखे गए नामित तत्वों तक पहुंचने के लिए, सामग्री का उपयोग करना एक अच्छा अभ्यास है form वस्तु है।

DOM ट्री में एक अनियंत्रित तत्व को एक्सेस करने के लिए जो किसी फॉर्म, उपयोग getElementByIdऔर तत्व के भीतर पाया जा सकता है id


8
आपका क्या मतलब है "स्वयं फॉर्म ऑब्जेक्ट का उपयोग करें"? एक बार आपके पास फॉर्म ऑब्जेक्ट होने के बाद, आप किसी विशेष तत्व को एक्सेस करने के लिए किस विधि का उपयोग करते हैं?
सेठ

2
मेरा मतलब है मैं तत्वों की iteratable संग्रह का उपयोग करने के लिए उपयोग नामित वस्तुओं और N6 (document.getElementById ( 'MyForm') तत्वों।) के लिए N5 (document.getElementById ( 'MyForm') elements.foo।) का उपयोग कर की सिफारिश करेंगे
सेर्गेई Ilinsky

मैं अपने कोड की शैली को परिभाषित कर रहा हूं ... और एक प्राथमिकता के रूप में मैं आईडी से चिपका रहा हूं .... इस तरह से तत्व की पहुंच पूरे पृष्ठ में सुसंगत है। + अन्य कारणों का उल्लेख किया।

1
GetElementID का उपयोग करके फ़ॉर्म को एक्सेस करना एक अच्छा अभ्यास क्यों है? डॉक्युमेंट क्यों होगा ।myForm काम नहीं करेगा? (मेरे पास एक ऐसी स्थिति है जहां काम नहीं कर रहा है और मैं सोच रहा हूं क्यों)
स्पंदुन

हे स्पंदुन, आपने शायद अपने मुद्दे को महीनों पहले हल कर दिया था (या हो सकता है कि आपने अपने हाथों को ऊपर फेंक दिया हो :)), लेकिन अगर आप सोच रहे थे, तो यह संभवतः आपके "HTML" नाम की विशेषता के साथ आपके फ़ॉर्म HTML तत्व की आपूर्ति नहीं करने के कारण था।
शेल्डन आर।

8

मैं 5 वीं विधि पसंद करता हूं। यही
[5] विशेष जावास्क्रिप्ट पहचानकर्ता का उपयोग करें ईवेंट हैंडलर से कार्य करने के लिए फार्म या क्षेत्र वस्तु पारित करने के लिए।

विशेष रूप से, रूपों के लिए:

<form id="form1" name="form1" onsubmit="return validateForm(this)">

तथा

// The form validation function takes the form object as the input parameter
function validateForm(thisForm) {
  if (thisform.fullname.value !=...

इस तकनीक का उपयोग करते हुए, फ़ंक्शन को कभी भी जानना नहीं पड़ता है
- ऑर्डर किस रूप में पृष्ठ में परिभाषित किया गया है,
- फॉर्म आईडी, न ही
- फॉर्म नाम

इसी तरह, खेतों के लिए:

<input type="text" name="maxWeight">
...
<input type="text" name="item1Weight" onchange="return checkWeight(this)">
<input type="text" name="item2Weight" onchange="return checkWeight(this)">

तथा

function checkWeight(theField) {
  if (theField.value > theField.form.maxWeight.value) {
    alert ("The weight value " + theField.value + " is larger than the limit");
    return false;
  }
return true;
}

इस मामले में, फ़ंक्शन को कभी भी किसी विशेष भार क्षेत्र के नाम या आईडी को जानना नहीं पड़ता है, हालांकि इसके लिए वजन सीमा क्षेत्र का नाम जानना आवश्यक है।


यह निश्चित नहीं है कि अंतर्निहित कारण क्या है, लेकिन मेरे पास यह तरीका है कि कुछ में खाली तार लौटा दें, लेकिन सभी परिस्थितियों में नहीं।
जैकब ली

7

यह वास्तव में आपके प्रश्न का उत्तर नहीं दे रहा है, लेकिन सिर्फ इस भाग पर:

[३] एक आईडी और एक नाम दोनों की आवश्यकता होती है ... दोनों का होना कुछ हद तक बेमानी है

आपको idवैसे भी प्रत्येक प्रपत्र फ़ील्ड पर एक विशेषता रखने की आवश्यकता होगी , ताकि आप इसके <label>तत्व को इसके साथ जोड़ सकें, जैसे:

<label for="foo">Foo:</label>
<input type="text" name="foo" id="foo" />

यह एक्सेसिबिलिटी के लिए आवश्यक है (यानी यदि आप लेबल और नियंत्रण को संबद्ध नहीं करते हैं, तो आप नेत्रहीन लोगों से इतनी नफरत क्यों करते हैं?)।

यह कुछ हद तक बेमानी है, हालांकि कम है जब आपके पास चेकबॉक्स / रेडियो बटन हैं, जहां उनमें से कई एक साझा कर सकते हैं name। अंततः, idऔर nameविभिन्न उद्देश्यों के लिए हैं, भले ही दोनों अक्सर एक ही मूल्य पर सेट हों।


5
यदि आप इसके लेबल में एक इनपुट लपेटते हैं, तो आपको एक आईडी या एक विशेषता की आवश्यकता नहीं है। <लेबल> फू: <इनपुट प्रकार = "पाठ" नाम = "फू" </ लेबल>
kennebec

3
बहुत सच है, हालांकि यह आपको देखने और महसूस करने के मामले में सीमित करता है।
पॉल डी। वेट

2
@ kennebec- यदि आप लेबल को किसी तत्व के साथ जोड़ना चाहते हैं तो आपको हमेशा एक आईडी का उपयोग करना चाहिए। IE (<8?) के पुराने संस्करणों ने लेबल के साथ तत्वों को उस लेबल के साथ संबद्ध नहीं किया था यदि आईडी और आईडी विशेषताओं के लिए मिलान नहीं थे ।
रॉब

@Kennebec ने जो लिखा है, इसके अलावा, ID का उपयोग करने से JS ग्लोबल्स बनते हैं और इससे बचा जाना चाहिए।
मिकमेकाना 16

1
@ मिमिकमेकाना: मैंने देखा है कि पहले मुद्दों का कारण बनता है। मुझे लगता है कि यदि आपकी आईडी यथोचित वर्णनात्मक है और आपके जावास्क्रिप्ट को समझदारी से नाम दिया गया है, तो यह मुद्दों का कारण बनने की संभावना नहीं है।
पॉल डी। वेट

6

यह थोड़ा पुराना है लेकिन मैं एक बात जोड़ना चाहता हूं जो मुझे लगता है कि प्रासंगिक है।
(मैं ऊपर एक या 2 थ्रेड पर टिप्पणी करने के लिए था, लेकिन ऐसा लगता है कि मुझे प्रतिष्ठा की आवश्यकता है 50 और मेरे पास केवल 21 है जब मैं यह लिख रहा हूं। :))
बस यह कहना चाहता हूं कि ऐसे समय हैं जब यह एक्सेस करने के लिए बहुत बेहतर है। आईडी के बजाय नाम से एक फॉर्म के तत्व। मैं खुद फॉर्म के बारे में बात नहीं कर रहा हूं। फ़ॉर्म, ठीक है, आप इसे एक आईडी दे सकते हैं और फिर इसके द्वारा एक्सेस कर सकते हैं। लेकिन अगर आपके पास एक रूप में एक रेडियो बटन है, तो इसे एक ही ऑब्जेक्ट के रूप में उपयोग करना बहुत आसान है (इसके मूल्य को प्राप्त करना और सेट करना) और आप इसे केवल नाम से कर सकते हैं, जहां तक ​​मुझे पता है।

उदाहरण:

<form id="mainForm" name="mainForm">
    <input type="radio" name="R1" value="V1">choice 1<br/>
    <input type="radio" name="R1" value="V2">choice 2<br/>
    <input type="radio" name="R1" value="V3">choice 3
</form>

आप रेडियो बटन R1 के चेक किए गए मान को
document.mainForm.R1.value
या
document.getEgetById ("mainForm") का उपयोग करके संपूर्ण रूप से प्राप्त / सेट कर सकते हैं । R1.value
इसलिए यदि आप एकात्मक शैली रखना चाहते हैं, तो आप कर सकते हैं। प्रपत्र तत्व के प्रकार की परवाह किए बिना, हमेशा इस विधि का उपयोग करना चाहते हैं। मुझे, मैं पूरी तरह से आईडी द्वारा नाम और पाठ बक्से द्वारा रेडियो बटन तक पहुंचने में सहज हूं।


क्या काम करता है document.forms.mainForm.R1.value, जो वास्तव में बदसूरत और थकाऊ-टू-टाइप का उपयोग करने से बचने का एक अच्छा तरीका हैdocument.getElementById()
काई कार्वर

2

पुराने जमाने के होने के नाते मैंने हमेशा 'document.myform.myvar' सिंटैक्स का उपयोग किया है, लेकिन मैंने हाल ही में पाया कि यह क्रोम (फ़ायरफ़ॉक्स और IE में ओके) में विफल रहा है। यह एक अजाक्स पेज था (यानी एक div के आंतरिक HTML संपत्ति में लोड)। हो सकता है कि क्रोम मुख्य दस्तावेज़ के एक तत्व के रूप में पहचान नहीं सका। मैंने इसके बजाय getElementById (फॉर्म को संदर्भित किए बिना) का उपयोग किया और यह ठीक काम किया।


आप बस सम्मिलित कर सकते हैं .forms, इसलिए document.forms.myform.myvar
काई कार्वर

1

पहले से ही बताई गई सभी चीजों को जोड़ने के लिए, आप inputया तो ऑब्जेक्ट फॉर्म की संपत्ति का उपयोग कर सकते हैं nameया idअधिमानतः उपयोग elementsकर सकते हैं, क्योंकि इसके बिना आपको एचटीएमएल तत्व के बजाय "फू" नामक फॉर्म की संपत्ति मिल सकती है। और @Paul डी। वेट के अनुसार यह नाम और आईडी दोनों के लिए पूरी तरह से ठीक है।

var myForm = document.getElementById("myform")
console.log(myForm.foo.value) // hey
console.log(myForm.foo2.value) // hey
//preferable
console.log(myForm.elements.foo.value) // hey
console.log(myForm.elements.foo2.value) // hey
<form id="myform">
  <input type="text" name="foo" id="foo2" value="hey">
</form>

HTMLFormElement.elements पेज पर MDN के अनुसार

HTMLFormElement संपत्ति तत्व तत्व में निहित सभी फॉर्म नियंत्रणों को सूचीबद्ध करते हुए HTMLFormControlsCollection देता है। स्वतंत्र रूप से, आप केवल लंबाई नियंत्रण का उपयोग करके प्रपत्र नियंत्रण की संख्या प्राप्त कर सकते हैं।

आप किसी अनुक्रमणिका या तत्व के नाम या आईडी का उपयोग करके लौटे संग्रह में एक विशेष रूप से नियंत्रण प्राप्त कर सकते हैं ।


1

nameक्षेत्र अच्छा काम करता है। यह करने के लिए एक संदर्भ प्रदान करता है elements

parent.children- माता-पिता के नाम क्षेत्र के साथ सभी तत्वों को सूचीबद्ध करेगा। parent.elements- form elementsऐसे ही सूची देंगेinput-text, text-area, etc

var form = document.getElementById('form-1');
console.log(form.children.firstname)
console.log(form.elements.firstname)
console.log(form.elements.progressBar); // undefined
console.log(form.children.progressBar);
console.log(form.elements.submit); // undefined
<form id="form-1">
  <input type="text" name="firstname" />
  <input type="file" name="file" />
  <progress name="progressBar" value="20" min="0" max="100" />
  <textarea name="address"></textarea>
  <input type="submit" name="submit" />
</form>

नोट: .elementsकाम करने के लिए, parentएक होने की जरूरत है <form> tag। जबकि, .childrenकिसी भी HTML-elementतरह काम करेगा - जैसे<div>, <span>, etc

शुभ लाभ...


0

फॉर्म 2 ठीक है, और फॉर्म 3 भी अनुशंसित है।
नाम और आईडी के बीच अतिरेक को संगतता बनाए रखने की आवश्यकता के कारण होता है, html 5 पर कुछ तत्व (जैसे कि img, form, iframe और इस तरह) अपने "नाम" विशेषता को खो देंगे, और अब से उन्हें संदर्भित करने के लिए बस उनकी आईडी का उपयोग करने की अनुशंसा की जाती है। पर :)


ऐसा लगता है कि इनपुट तत्व अपना नाम गुण कभी नहीं खोएंगे, क्योंकि यह सर्वर साइड भाषाओं द्वारा उपयोग किया जाता है। तो सवाल यह है कि, यदि आपके पास केवल नाम विशेषता सेट है तो मानक अनुपालन विधि क्या है?
सेठ

मानकों के अनुरूप विकास में आपके पास सिर्फ नाम नहीं होगा, शुरुआत के लिए। यदि आपके पास वास्तव में आईडी नहीं है, तो मैं दस्तावेज़ का सुझाव देता हूं। EgetByName () फ़ंक्शन।
विंटरम्यूट

0

अन्य उत्तरों के पूरक के लिए, document.myForm.foo तथाकथित DOM स्तर 0 है, जो कि नेटस्केप द्वारा लागू किया गया तरीका है और इस प्रकार यह वास्तव में एक खुला मानक नहीं है, हालांकि यह अधिकांश ब्राउज़रों द्वारा समर्थित है।


4
नाम, आईडी और इंडेक्स द्वारा फॉर्म और फॉर्म कंट्रोल एक्सेस करना HTML संग्रह के लिए DOM 2 HTML मानक का हिस्सा है ।
1

0

इस पृष्ठ को देखें: https://developer.mozilla.org/En/DOM/Document.getElementsByName

document.getElementsByName('foo')[0]; // returns you element.

इसे 'एलिमेंट्स' होना चाहिए और एक एरे को वापस करना होगा क्योंकि एक से अधिक तत्वों का एक ही नाम हो सकता है।


@robert, मैं अब सोच रहा हूं कि यह एक अच्छा समाधान हो सकता है, हालांकि डॉक्स से सीधे इसने मुझे परेशान कर दिया: "यह विधि दस्तावेज़ प्रकारों और इसके लिए वर्तमान गैर-मानक व्यवहार के बीच उपरोक्त परिवर्तनों को दिए गए उपयोग के लिए संदिग्ध हो सकती है। एक्सएचटीएमएल में विधि। "
सेर

नमस्ते। इसके खिलाफ किस दस्तावेज ने सुझाव दिया? मुझे लगता है कि यदि आप अपने द्वारा काम कर रहे सभी डोम वातावरण में xhtml का उपयोग कर रहे हैं, तो आपको ठीक होना चाहिए। इसके अलावा, कौन से ब्राउज़र इसका समर्थन नहीं करते हैं? यहाँ IE के लिए डॉक्स है: msdn.microsoft.com/en-us/library/ms536438(VS.85).aspx उपरोक्त मोज़िला के अलावा, और कौन इसका समर्थन नहीं कर सकता है?
रोबर्ट

0

मेरा उत्तर सटीक प्रश्न पर अलग होगा। यदि मैं किसी विशेष तत्व को विशेष रूप से एक्सेस करना चाहता हूं, तो क्या मैं document.getElementById () का उपयोग करूंगा। एक उदाहरण एक व्यक्ति का पूरा नाम कंप्यूटिंग कर रहा है, क्योंकि यह कई क्षेत्रों पर निर्माण कर रहा है, लेकिन यह एक दोहराने योग्य सूत्र है।

यदि मैं तत्व को कार्यात्मक संरचना (एक रूप) के हिस्से के रूप में एक्सेस करना चाहता हूं, तो क्या मैं उपयोग करूंगा:

var frm = document.getElementById('frm_name');
for(var i = 0; i < frm.elements.length;i++){
   ..frm.elements[i]..

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

डेटा के एकत्रीकरण के लिए (जैसे फॉर्म में डेटा के आधार पर पाई चार्ट बनाना) मैं कॉन्फ़िगरेशन दस्तावेजों और कस्टम मेड जावास्क्रिप्ट वस्तुओं का उपयोग करता हूं। फिर इसके संदर्भ के संबंध में क्षेत्र का सही अर्थ महत्वपूर्ण है और क्या मैं दस्तावेज़ का उपयोग करता हूं ।getElementById ()।


0

क्योंकि मामला [2] document.myForm.fooइंटरनेट एक्सप्लॉयर की एक बोली है। इसलिए इसके बजाय, मैं पसंद करता हूं document.forms.myForm.elements.fooया document.forms["myForm"].elements["foo"]


-1

मुझे यह पसंद है

document.forms['idOfTheForm'].nameOfTheInputFiled.value;

2
एसओ में आपका स्वागत है, हम आपके इनपुट की सराहना करते हैं। कृपया अपना उत्तर संपादित करें और क्यों और कैसे समझाएँ।
बी - रिआन
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.