সেরা অনুশীলন: এইচটিএমএল আইডি বা নাম বৈশিষ্ট্য দ্বারা ফর্ম উপাদানগুলি অ্যাক্সেস করবেন?

Question

যে কোনও পাকা জাভাস্ক্রিপ্ট বিকাশকারী জানেন, একই জিনিসটি করার অনেকগুলি (খুব বেশি) উপায় রয়েছে। উদাহরণস্বরূপ, বলুন যে আপনার নীচের মতো একটি পাঠ্য ক্ষেত্র রয়েছে:

<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] এবং [3] মজিলা গেকোর ডকুমেন্টেশনে ভালভাবে নথিভুক্ত হয়েছে তবে দুটিও আদর্শ নয়। [1] দরকারী হিসাবে খুব সাধারণ এবং [3] একটি আইডি এবং একটি নাম উভয় প্রয়োজন (ধরে নিলে আপনি একটি সার্ভার পাশের ভাষায় ডেটা পোস্ট করবেন)। আদর্শভাবে, কেবলমাত্র একটি আইডি বৈশিষ্ট্য বা একটি নাম বৈশিষ্ট্য থাকা ভাল (উভয়টি কিছুটা অপ্রয়োজনীয়, বিশেষত যদি আইডি কোনও CSS এর জন্য প্রয়োজনীয় না হয় এবং টাইপস ইত্যাদির সম্ভাবনা বৃদ্ধি করে)।

[২] এটি সর্বাধিক স্বজ্ঞাত বলে মনে হচ্ছে এবং এটি ব্যাপকভাবে ব্যবহৃত হয়েছে বলে মনে হয়, তবে আমি এটি গেকোর ডকুমেন্টেশনে উল্লেখ করে দেখিনি এবং আমি উভয় ফরোয়ার্ডের সামঞ্জস্যতা এবং ক্রস ব্রাউজারের সামঞ্জস্যতা সম্পর্কে চিন্তিত (এবং অবশ্যই আমি হতে চাই) যতটা সম্ভব মান সম্মত)।

তাহলে এখানে সেরা অনুশীলন কি? কেউ কি DOM ডকুমেন্টেশন বা ডাব্লু 3 সি স্পেসিফিকেশনের এমন কোনও বিষয়কে নির্দেশ করতে পারে যা এটি সমাধান করতে পারে?

দ্রষ্টব্য আমি বিশেষত একটি গ্রন্থাগারবিহীন সমাধানে (jQuery / প্রোটোটাইপ) আগ্রহী।

Comments

আমি অনুমান করি যে এটি কীভাবে ফুটে উঠেছে তা হল আমি নামটি বৈশিষ্ট্যটি ব্যবহার করে কোনও ফর্ম উপাদান অ্যাক্সেস করার জন্য সবচেয়ে মানদণ্ডের অনুগত

— উপায়ের সন্ধান করছি

"উভয় থাকা কিছুটা অপ্রয়োজনীয়, বিশেষত যদি আইডি কোনও CSS এর জন্য প্রয়োজনীয় না হয় এবং টাইপসের সম্ভাবনা বাড়ায়" - লেবেলের কার্যকর ব্যবহারের জন্য আইডি প্রয়োজনীয়। শুধু সিএসএস নয়।

কখনও কখনও একটি ওয়েবপৃষ্ঠায় একাধিক ফর্ম রয়েছে এবং আইডি বৈশিষ্ট্যগুলির সংঘর্ষ হতে পারে।

— কলমারিয়াস

Answer 1

আপনার ফর্মটি কেবল একটি আইডি দিন এবং আপনার ইনপুটটিকে কেবল একটি নাম দিন :

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

তারপরে আপনার ইনপুট উপাদানটি অ্যাক্সেস করার সর্বাধিক মান-সম্মতিযুক্ত এবং সর্বনিম্ন সমস্যাযুক্ত উপায় হ'ল:

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

ন্যায়বিচারের .elements["foo"]পরিবর্তে ব্যবহার করা .fooঅধিকতর পছন্দনীয় কারণ পরবর্তীকালে এইচটিএমএল উপাদানটির পরিবর্তে "ফু" নামক ফর্মটির কোনও সম্পত্তি ফিরে আসতে পারে!

Comments

@ কার্ল ... আপনি কী অর্জন করতে চাইছেন? আপনার এইচটিএমএলে জেএসকে ইনলাইন করা বরং অচল (এবং প্রায়শই অদক্ষ, যেহেতু এটি কোডের চারপাশে একটি মোড়ক ফাংশন তৈরি করে), আপনি সর্বদা মিথ্যা ফেরত আসেন এর অর্থ আপনার ফর্মটি কখনও জমা দেবে না As সুতরাং যদি না হয় ফর্মটি জমা দেওয়ার কথা বলা হয় (সম্ভবত এটি জেএস কোড দ্বারা সম্পূর্ণ ব্যবহৃত হয়), বা মাইফঙ্ক (এটি) এজেএক্সের মাধ্যমে জমা না দেওয়া (এবং আপনি এজেএক্সের ক্ষেত্রে ফ্যালব্যাক হিসাবে একটি নিয়মিত জমা দেওয়ার বিষয়ে চিন্তা করবেন না) কোনওভাবে ব্যর্থ হয়), ... তাহলে আপনি ভুল করেছেন।

— Doin থেকে

সাধারণত, শুধুমাত্র বৈধ ফর্ম তথ্য পাঠাবার জন্য, আপনাকে করতে চাই: myform.onsubmit = validateForm;(যেখানে myform একটি পরিবর্তনশীল ফর্ম উপাদান উল্লেখ করা হয়, এবং validateForm আপনার বৈধতা ফাংশনের নাম ... কিন্তু আপনি তা myFunc নাম পারেন যদি আপনি সত্যিই , সত্যিই করতে চান )। গুরুত্বপূর্ণ বিষয়টি হ'ল ফর্মটি বৈধ না হওয়ার সাথে সাথে ব্যবহারকারীর কাছে সমস্যা ক্ষেত্র (গুলি) ইঙ্গিত করার সাথে সাথে মিথ্যাvalidateForm() প্রত্যাবর্তন করা উচিত । ফর্ম ডেটা সঠিকভাবে যাচাই করা হলে এটি সত্য হওয়া উচিত , যা জমা দেওয়ার ক্রিয়াটি এগিয়ে যাওয়ার অনুমতি দেয়।

— Doin থেকে

ফর্ম ক্ষেত্রে আইডিগুলি এড়ানোর আরও একটি কারণ রয়েছে: যদি আপনি একই ফর্মের একাধিক উদাহরণ চান (একই পৃষ্ঠায়)।

— কোরিয়ান্ডার

@ জোওও যে খুব কার্যকর, প্রদত্ত "ফু" জাভাস্ক্রিপ্টের সম্পত্তি নাম হিসাবে বৈধ। (এটি নাও হতে পারে - এইচটিএমএল 5 গুণটির মানটির উপরে প্রায় কোনও বিধিনিষেধ রাখে না name, সুতরাং উদাহরণস্বরূপ আপনার থাকতে পারে <select name="a+b">বা <input type="text" name="...2">যা জাভাস্ক্রিপ্ট ব্যবহার করে রেফারেন্স করা যায় না ppopertyName স্বরলিপি)। সুস্পষ্ট [] স্বরলিপি এছাড়াও এক্সপ্রেশন থেকে নির্মিত নাম মঞ্জুরি দেয়, যেমন myCheckBox = document.getElementById("myform").elements["CHK"+i]। প্লাস, স্টাইলিস্টিক্যালি, আমি মনে করি [] আরও ভাল - এটি পরিষ্কার করে দেয় যে এগুলি কেবল জাভাস্ক্রিপ্ট অবজেক্টের বৈশিষ্ট্য নয়। YMMV।

— Doin থেকে

আবরণ প্রসঙ্গে, মনে রাখবেন যে লেটিং কেবল স্টাইল গাইড এবং একটি আবরণ "ত্রুটি" এর অর্থ আপনার জাভাস্ক্রিপ্টটি অবৈধ বা ভুল। যদিও এই বিশেষ ক্ষেত্রে, প্রান্তিককরণের নিয়মটি যা বলছে তা হ'ল "জাভাস্ক্রিপ্ট অবজেক্টের বৈশিষ্ট্যগুলি উল্লেখ করার সময় বিন্দু চিহ্নিতকরণ পছন্দ করুন"। এটি একটি ভাল ধারণা, এবং আমি সাধারণভাবে এটি প্রস্তাব। কিন্তু যখন Linter এই উপলব্ধি নয়, elementsএকটি স্বাভাবিক জাতীয় বস্তু নয়, এবং elements.fooবা elements["foo"]আসলে elements.namedItem ( "foo বিন্যাস") রূপান্তরিত হচ্ছে। অর্থাত্ আপনি কোনও ডিএম-সংজ্ঞায়িত ফাংশন কল করছেন , জেএস সম্পত্তি উল্লেখ করছেন না!

— Doin থেকে

Answer 2

[1] ডকুমেন্ট.ফর্মস [0]। উপাদানগুলি [0];

" না-ওমগ-নেভেন! " মনে আসে যখন আমি উপাদান অ্যাক্সেসের এই পদ্ধতিটি দেখি। এটির সাথে সমস্যাটি হ'ল এটি ধরে নেওয়া হয় যে ডিওএম হ'ল একটি সাধারণ ডেটা স্ট্রাকচার (যেমন: একটি অ্যারে) যেখানে উপাদান ক্রমটি স্থিতিশীল, ধারাবাহিক বা যাইহোক নির্ভরযোগ্য। আমরা জানি যে 99.9999% সময়, এটি এমন নয়। ফর্মের inputমধ্যে পুনরায় ক্রমিক বা উপাদানগুলি, formপ্রশ্নে ফর্মের আগে পাতায় অন্য একটি যোগ করা , বা ফর্মটিকে প্রশ্নে সরিয়ে নেওয়া এই ক্ষেত্রেই এই কোডটি ভেঙে যায়। ছোট গল্প: এটি খুব ভঙ্গুর। যত তাড়াতাড়ি আপনি কিছু যুক্ত বা সরানো হবে, এটি ব্রেক হয়ে যাচ্ছে।

[২] ডকুমেন্ট.মায়ফর্ম.ফু;

আমি এই নিয়ে সের্গেই আইলিনস্কির সাথে আছি :

• সুনির্দিষ্ট উপাদানগুলির idবৈশিষ্ট্য উল্লেখ করে অ্যাক্সেস করুন :document.getElementById("myform");
• নাম হিসাবে ফর্ম উপাদানগুলি অ্যাক্সেস করুন, তাদের পিতামাতার ফর্ম উপাদানের সাথে সম্পর্কিত: document.getElementById("myform").foo;

এই পদ্ধতির সাথে আমার প্রধান সমস্যাটি nameহ'ল কোনও ফর্মের সাথে প্রয়োগ করার পরে বৈশিষ্ট্যটি অকেজো। নামটি POST / GET এর অংশ হিসাবে সার্ভারে দেওয়া হয় না এবং হ্যাশ স্টাইলের বুকমার্কগুলির জন্য কাজ করে না।

[3] ডকুমেন্ট.জেটএলমেন্টবিআইআইডি ('foo');

আমার মতে, এটি সবচেয়ে পছন্দনীয় পদ্ধতি। সরাসরি অ্যাক্সেস হ'ল সবচেয়ে সংক্ষিপ্ত এবং স্পষ্ট পদ্ধতি।

[4] ডকুমেন্ট.সেটমেন্ট বিইআইডি ('মাইফর্ম') f

আমার মতে এটি গ্রহণযোগ্য, তবে প্রয়োজনের চেয়ে আরও ভার্বোজ। পদ্ধতি # 3 আরও ভাল।

---

আমি ঠিক তখনই ডগলাস ক্রকফোর্ডের একটি ভিডিও দেখতে পেয়েছি এবং তিনি এই বিষয়টিতেই মাপলেন । আগ্রহের পয়েন্টটি -12: 00 এ রয়েছে। সংক্ষেপ:

• ডকুমেন্ট সংগ্রহ (ডকুমেন্ট.অ্যাঙ্কর, ডকুমেন্ট.ফর্ম ইত্যাদি) অপ্রচলিত এবং অপ্রাসঙ্গিক (পদ্ধতি 1)।
• nameঅ্যাট্রিবিউট এগুলি অ্যাক্সেস করতে না, জিনিষ নাম ব্যবহার করা হয়। এটি উইন্ডোজ, ইনপুট ক্ষেত্র এবং অ্যাঙ্কর ট্যাগগুলির মতো জিনিসের নামকরণের জন্য।
• "আইডি হ'ল এমন জিনিস যা আপনার কোনও উপাদানকে স্বতন্ত্রভাবে সনাক্ত করার জন্য ব্যবহার করা উচিত যাতে আপনি এটিতে অ্যাক্সেস পেতে পারেন They তারা (নাম এবং আইডি) বিনিময়যোগ্য হিসাবে ব্যবহৃত হত, কিন্তু তারা আর হয় না" "

তাই সেখানে যদি আপনি এটি আছে। শব্দার্থকভাবে, এটি সর্বাধিক বোধ করে।

Comments

সুতরাং এটি কি কেবল একটি হ্যাক? । document.getElementById ( "myform") foo বিন্যাস; ডমকে বেশ খানিকটা অধ্যয়ন করার পরেও কেন এটি এমনকি কাজ করে তা সম্পর্কে আমি অস্পষ্ট। আমার ধারণা ফর্ম অবজেক্টটিও এইচটিএমএল নাম বৈশিষ্ট্যে সূচিত হয় এমন চাইল্ড এলিমেন্টগুলির একটি অ্যারে ...

— সেথ

এছাড়াও আপনি উল্লেখ করেছেন যে "নামটি পোষ্ট / জিইটি অংশ হিসাবে সার্ভারে দেওয়া হয় না এবং হ্যাশ স্টাইলের বুকমার্কগুলির জন্য কাজ করে না"। আইএস সার্ভারে পাস করার জন্য এটি কি ঠিক নয়? আপনি যখন পিএইচপি দিয়ে কাজ করছেন, it's _POST বিশ্বব্যাপী এটি আপনার নামের সূচক is

— শেঠ

@ জাস্টিন, এটি নামের বৈশিষ্ট্য যা সার্ভারে চলে যায়।

— অনুরাগ

@seth পুরোনো করে DOM চশমা কেন সম্পর্কে খুব অস্পষ্ট মনে document.aForm.fooকাজ, কিন্তু HTML5 এর বৈশিষ্ট পরিষ্কারভাবে একটি ইন্টারফেস সংজ্ঞায়িত বলে মনে হয় HTMLFormElementযা caller getter any namedItem(in DOMString name);। আরও কি কি ww.org.org/specs/web-apps/current-work/m মাল্টিপেজ/…

— অনুরাগ

আপনারা সবাই বলছেন: "... কোনও ফর্মের সাথে প্রয়োগ করার পরে নামের বৈশিষ্ট্যটি অকেজো ..." আমি কোনটির নামের বৈশিষ্ট্যটি নিয়ে কথা বলছি না inputবা select, আমি এ এর ​​নামের বৈশিষ্ট্যটি নিয়ে কথা বলছি form। একটি নাম অ্যাট্রিবিউট form নেই সার্ভারে পাস দেখায়।

— জাস্টিন জনসন

Answer 3

কোনও ফর্মের মধ্যে নামযুক্ত উপাদানগুলি অ্যাক্সেস করার জন্য, formঅবজেক্টটি নিজেই ব্যবহার করা ভাল অভ্যাস ।

DOM গাছের একটি স্বেচ্ছাসেবী উপাদান অ্যাক্সেস করার জন্য যা উপলক্ষ্যে কোনও ফর্ম, ব্যবহার getElementByIdএবং উপাদানটির মধ্যে পাওয়া যায় id।

Comments

"ফর্ম অবজেক্ট নিজেই ব্যবহার করুন" এর অর্থ কী? আপনার ফর্ম অবজেক্টটি একবার হয়ে গেলে, কোনও নির্দিষ্ট উপাদান অ্যাক্সেস করার জন্য আপনি কোন পদ্ধতিটি ব্যবহার করেন?

— শেঠ

আমি বলতে চাইছি নামযুক্ত আইটেমগুলি অ্যাক্সেস করার জন্য আমি N5 (ডকুমেন্ট.সেটিমেন্টবাইআইডি ('মাইফর্ম')। এলিমেন্টস.ফু) ব্যবহার করার পরামর্শ দেব এবং উপাদানগুলির পুনরাবৃত্তিযোগ্য সংগ্রহের অ্যাক্সেসের জন্য এন 6 (ডকুমেন্ট.সেটিমেন্টবাইআইডি ('মাইফর্ম')। উপাদান)) ব্যবহার করতে সুপারিশ করব

— সের্গেই ইলিনস্কি

আমি আমার কোডের স্টাইলটি সংজ্ঞায়িত করছি ... এবং অগ্রাধিকার হিসাবে আমি আইডিগুলিতে আঁকছি .... এই ভাবে উপাদানটির অ্যাক্সেস পুরো পৃষ্ঠাতে সামঞ্জস্যপূর্ণ। + অন্যান্য কারণ উল্লেখ করা হয়েছে।

GetElementID ব্যবহার করে ফর্মটি অ্যাক্সেস করা কেন ভাল অনুশীলন? ডকুমেন্ট.মাইফর্ম কেন কাজ করবে না? (আমার এমন পরিস্থিতি রয়েছে যেখানে এটি কাজ করছে না এবং আমি কেন ভাবছি)

— স্পুনডুন

আরে স্পুন্দুন, আপনি সম্ভবত কয়েক মাস আগে আপনার সমস্যাটি সমাধান করেছেন (বা সম্ভবত আপনি আপনার হাত উপরে ছুঁড়ে ফেলেছেন :)), তবে আপনি যদি ভাবছিলেন যে সম্ভবত এটি আপনার ফর্ম এইচটিএমএল উপাদানটি একটি "নাম" বৈশিষ্ট্যের সাথে সরবরাহ না করার কারণে হয়েছে।

— শেল্ডন আর।

Answer 4

আমি অনেকটা ৫ ম পদ্ধতি পছন্দ করি। যে
[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;
}

এই ক্ষেত্রে, ফাংশনটির কোনও নির্দিষ্ট ওজন ক্ষেত্রের নাম বা আইডি জানতে হবে না, যদিও এটির ওজন সীমা ক্ষেত্রের নামটি জানা দরকার।

Comments

অন্তর্নিহিত কারণটি কী তা নিশ্চিত নয় তবে আমার এই পদ্ধতির কারও কারও মধ্যে খালি স্ট্রিংগুলি ফিরে এসেছে, তবে সমস্ত নয়।

— জ্যাকব লি

Answer 5

এটি সত্যিই আপনার প্রশ্নের উত্তর দিচ্ছে না, তবে কেবল এই অংশে:

[3] এর জন্য একটি আইডি এবং একটি নাম উভয়ই দরকার ... উভয়ই কিছুটা অতিরিক্ত বাজে

আপনার সম্ভবত idপ্রতিটি ফর্ম ক্ষেত্রে একটি বৈশিষ্ট্য থাকা দরকার , যাতে আপনি এর <label>উপাদানটির সাথে এটি যুক্ত করতে পারেন :

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

এটি অ্যাক্সেসযোগ্যতার জন্য প্রয়োজনীয় (যেমন আপনি যদি ফর্ম লেবেল এবং নিয়ন্ত্রণগুলি সংযুক্ত না করেন তবে অন্ধ লোককে এত ঘৃণা করবেন কেন?)।

এটি কিছুটা অপ্রয়োজনীয়, যদিও আপনার চেকবক্সগুলি / রেডিও বোতামগুলি থাকে যখন তাদের বেশ কয়েকটি ভাগ করে নিতে পারে name। শেষ পর্যন্ত, idএবং nameবিভিন্ন উদ্দেশ্যে হয়, যদিও উভয়ই একই মানের ক্ষেত্রে সেট করা থাকে।

Comments

আপনি যদি তার লেবেলে কোনও ইনপুট মোড় করেন তবে আপনাকে গুনের জন্য কোনও আইডি বা কোনও দরকার নেই। <লেবেল> ফু: <ইনপুট টাইপ = "পাঠ্য" নাম = "ফু" </

— লবেল

খুব সত্য, যদিও এটি চেহারা এবং বোধের ক্ষেত্রে আপনি যা অর্জন করতে পারেন তা সীমাবদ্ধ করে না।

— পল ডি ওয়েট

@ কেনেবেক you আপনি যদি লেবেলের কোনও উপাদানটির সাথে যুক্ত থাকতে চান তবে আপনার সর্বদা একটি আইডি ব্যবহার করা উচিত। আই ই (<8?) এর পুরাতন সংস্করণ যদি মিলে নি ট্যাগ একটি লেবেল ভিতরে না সহযোগী উপাদান করেনি জন্য এবং আইডি বৈশিষ্ট্যাবলী।

— রবিজি

@ টেনেনিব্যাক যা লিখেছেন তা ছাড়াও আইডি ব্যবহার করা জেএস গ্লোবাল তৈরি করে এবং এড়ানো উচিত।

— মাইকমেকানা

@ মিকেম্যাকানা: আমি এর আগে সমস্যার কারণ দেখেছি। আমি মনে করি যদি আপনার আইডিগুলি যুক্তিসঙ্গতভাবে বর্ণনামূলক হয় এবং আপনার জাভাস্ক্রিপ্টটি সংবেদনশীলভাবে নামকরণ করা হয় তবে সমস্যাটি হওয়ার সম্ভাবনা কম।

— পল ডি ওয়েট

Answer 6

এটি কিছুটা পুরানো তবে আমি প্রাসঙ্গিক বলে মনে করি এমন একটি জিনিস যুক্ত করতে চাই।
(আমি উপরে একটি বা 2 টি থ্রেডে মন্তব্য করতে চাইছিলাম তবে মনে হয় এটি আমার খ্যাতি 50 প্রয়োজন এবং আমি
যখন এটি লিখছি তখন আমার কেবল 21 আছে :) :) কেবল বলতে চাই যে এমন সময় আছে যখন এটি অ্যাক্সেস করা আরও ভাল access আইডি না দিয়ে নামের দ্বারা একটি ফর্মের উপাদান। আমি নিজেই ফর্ম সম্পর্কে কথা বলছি না। ঠিক আছে, ফর্মটি আপনি এটিকে একটি আইডি দিতে পারেন এবং তারপরে এটি অ্যাক্সেস করতে পারেন। তবে যদি কোনও ফর্মটিতে আপনার কাছে রেডিও বোতাম থাকে তবে এটি একটি একক অবজেক্ট হিসাবে (এটির মূল্য অর্জন এবং সেট করা) হিসাবে ব্যবহার করা আরও সহজ এবং আপনি যতদূর জানি কেবল নামেই এটি করতে পারবেন।

উদাহরণ:

<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>

আপনি
ডকুমেন্ট.মেনফর্ম.আর 1.মূল্য
বা
ডকুমেন্ট.জেটমেন্টমেন্ট বায়আইডি ("মেইনফর্ম") ব্যবহার করে পুরো হিসাবে রেডিও বোতাম আর 1-এর চেক করা মানটি সেট / সেট করতে পারেন R
আর 1.value তাই আপনি যদি একক শৈলী রাখতে চান তবে আপনি ফর্ম উপাদানগুলির ধরণ নির্বিশেষে সর্বদা এই পদ্ধতিটি ব্যবহার করতে চান। আমি, আমি আইডি দিয়ে রেডিও বোতাম এবং আইডি দ্বারা পাঠ্য বাক্সগুলি অ্যাক্সেস করতে পুরোপুরি আরামদায়ক।

Comments

কী কাজ করে document.forms.mainForm.R1.value, যা প্রকৃতপক্ষে কুৎসিত এবং ক্লান্তিকর-থেকে-টাইপ ব্যবহার করা এড়ানো একটি দুর্দান্ত উপায়document.getElementById()

— Kai Carver

Answer 7

পুরাতন ফ্যাশন হওয়ার কারণে আমি সবসময় 'ডকুমেন্ট.মাইফর্ম.মাইভার' সিনট্যাক্স ব্যবহার করেছি তবে আমি সম্প্রতি এটি ক্রোমে ব্যর্থ হয়েছি (ফায়ারফক্স এবং আইই তে ঠিক আছে)। এটি একটি আজাক্স পৃষ্ঠা ছিল (অর্থাত্ একটি ডিভির অভ্যন্তরীণ এইচটিএমএল সম্পত্তিতে লোড করা)। সম্ভবত ক্রোম মূল নথির উপাদান হিসাবে ফর্মটি চিনতে পারে নি। আমি পরিবর্তে getElementById ব্যবহার করেছি (ফর্মটি উল্লেখ না করে) এবং এটি ঠিক আছে।

Comments

আপনি কেবল সন্নিবেশ করতে পারেন .forms, তাই document.forms.myform.myvar

— কাই কার্ভার

Answer 8

কেবল ইতিমধ্যে বলা সমস্ত কিছু যুক্ত করার জন্য আপনি অবজেক্ট ফর্মের সম্পত্তিটি ব্যবহার inputকরে nameবা idব্যবহারের মাধ্যমে অ্যাক্সেস করতে পারেন elements, কারণ এটি ছাড়া আপনি এইচটিএমএল উপাদানটির পরিবর্তে "ফু" নামক ফর্মটির সম্পত্তি পেতে পারেন। এবং @ পল ডি ওয়েটের মতে নাম এবং আইডি উভয়ই রাখা ঠিক।

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>

এইচটিএমএলফর্মএলেটমেন্ট উপাদানসমূহ পৃষ্ঠায় এমডিএন অনুসারে to

এইচটিএমএলফর্মএলেমেন্ট বৈশিষ্ট্য উপাদানগুলি উপাদানটিতে থাকা সমস্ত ফর্ম নিয়ন্ত্রণের তালিকা করে একটি এইচটিএমএলফর্মকন্ট্রোল সংগ্রহ সংগ্রহ করে। স্বতন্ত্রভাবে, আপনি দৈর্ঘ্যের সম্পত্তি ব্যবহার করে ফর্ম নিয়ন্ত্রণের সংখ্যা অর্জন করতে পারেন।

আপনি কোনও সূচক বা উপাদানটির নাম বা আইডি ব্যবহার করে ফেরত সংগ্রহের কোনও নির্দিষ্ট ফর্ম নিয়ন্ত্রণ অ্যাক্সেস করতে পারেন ।

Answer 9

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।

শুভকামনা ...

Answer 10

ফর্ম 2 ঠিক আছে, এবং ফর্ম 3 টিও সুপারিশ করা হয়েছে।
নাম এবং আইডির মধ্যে অপ্রয়োজনীয়তা সামঞ্জস্যতা রাখার প্রয়োজনীয়তার কারণে হয়, এইচটিএমএল 5 তে কিছু উপাদান (img, ফর্ম, iframe এবং এর মতো) তাদের "নাম" বৈশিষ্ট্যটি হারাবে এবং এগুলি থেকে তাদের রেফারেন্স দেওয়ার জন্য কেবল তাদের আইডি ব্যবহার করার পরামর্শ দেওয়া হচ্ছে চালু :)

Comments

মনে হচ্ছে ইনপুট উপাদানগুলি সার্ভার সাইডের ভাষা দ্বারা যেভাবে ব্যবহৃত হয় তার কারণে তাদের নাম বৈশিষ্ট্যটি কখনই হারাবে না। সুতরাং প্রশ্নটি থেকেই যায়, যদি আপনার কাছে কেবল নামটির বৈশিষ্ট্যটি সেট থাকে তবে মান অনুসারে কী হবে?

— শেঠ

মান মেনে চলার বিকাশে আপনার কেবল নাম নেই, শুরু করার জন্য ters যদি আপনার সত্যিই আইডি না থাকে তবে আমি ডকুমেন্ট.জেট এলিমেন্টবাইনেম () ফাংশনটির পরামর্শ দেব।

— শীতকালীন

Answer 11

অন্যান্য উত্তরগুলির পরিপূরক হিসাবে ডকুমেন্ট.মাইফর্ম.ফু হ'ল তথাকথিত ডিওএম স্তর 0, যা নেটস্কেপ দ্বারা বাস্তবায়িত উপায় এবং এটি বেশিরভাগ ব্রাউজার দ্বারা সমর্থিত হওয়া সত্ত্বেও সত্যই এটি একটি উন্মুক্ত মান নয়।

Comments

নাম, আইডি এবং সূচক দ্বারা ফর্ম এবং ফর্ম নিয়ন্ত্রণ অ্যাক্সেস করা এইচটিএমএল সংগ্রহের জন্য ডিওএম 2 এইচটিএমএল স্ট্যান্ডার্ডের অংশ ।

— রবজি

Answer 12

এই পৃষ্ঠাটি দেখুন: https://developer.mozilla.org/En/DOM/Docament.getElementsByName

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

এটি 'উপাদানগুলি' হতে হবে এবং অবশ্যই একটি অ্যারে ফিরিয়ে আনতে হবে কারণ একাধিক উপাদানের একই নাম থাকতে পারে।

Comments

@ আরবার্ট, আমি এখন ভাবছি এটি একটি ভাল সমাধান হতে পারে, যদিও ডক্সের বাইরে থেকে আমাকে ঘাবড়ে গেছে: "ডকুমেন্টের ধরণের উপরের পরিবর্তনগুলি এবং এটির জন্য বর্তমান অ-মানক আচরণের মধ্যে এই ব্যবহারটি প্রশ্নবিদ্ধ হতে পারে এক্সএইচটিএমএল পদ্ধতি "।

— শেঠ

হাই! এর বিপরীতে কোন ডকুমেন্টেশন পরামর্শ দিয়েছে? আমি মনে করি আপনি যদি কাজ করছেন এমন সমস্ত DOM পরিবেশে যদি এক্সএইচটিএমএল ব্যবহার করে থাকেন তবে আপনার ঠিক আছে। এছাড়াও, কোন ব্রাউজারগুলি এটি সমর্থন করে না? আইই এর জন্য এখানে ডকস রয়েছে: এমএসডিএন.মাইক্রোসফটকম /en-us/library/ms536438(VS.85).aspx উপরের মজিলা ছাড়াও আর কে সমর্থন করবে না?

— রবার্ট

Answer 13

আমার উত্তরটি সঠিক প্রশ্নের সাথে পৃথক হবে। যদি আমি নির্দিষ্টভাবে কোনও উপাদান অ্যাক্সেস করতে চাই, তবে আমি ডকুমেন্ট.জেটলেমেন্টবিআইআইডি () ব্যবহার করব। একটি উদাহরণ কোনও ব্যক্তির পুরো নাম গণনা করা, কারণ এটি একাধিক ক্ষেত্রের উপর নির্মাণ করছে তবে এটি পুনরাবৃত্তিযোগ্য সূত্র।

যদি আমি একটি কার্যকরী কাঠামোর (একটি ফর্ম) অংশ হিসাবে উপাদানটি অ্যাক্সেস করতে চাই, তবে আমি ব্যবহার করব:

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

এটি ব্যবসায়ের দৃষ্টিকোণ থেকে এটিও কাজ করে। লুপের মধ্যে পরিবর্তনগুলি প্রয়োগে কার্যকরী পরিবর্তনগুলির সাথে চলে এবং এর অর্থপূর্ণ। আমি এটি বেশিরভাগ ব্যবহারকারীর অনুকূল বৈধতা এবং ভুল ডেটা পরীক্ষা করার জন্য নেটওয়ার্ক কল প্রতিরোধের জন্য প্রয়োগ করি। আমি বৈধতা সার্ভারের দিকটি পুনরাবৃত্তি করছি (এবং এটিতে আরও কিছু যুক্ত করব) তবে আমি যদি ব্যবহারকারী ক্লায়েন্টকে সহায়তা করতে পারি তবে তা সবার পক্ষে উপকারী।

ডেটা একীকরণের জন্য (যেমন ফর্মের ডেটার ভিত্তিতে পাই চার্ট তৈরি করা) আমি কনফিগারেশন ডকুমেন্ট এবং কাস্টম তৈরি জাভাস্ক্রিপ্ট অবজেক্ট ব্যবহার করি use তারপরে ক্ষেত্রটির যথাযথ অর্থটি এর প্রসঙ্গের সাথে সম্পর্কিত এবং আমি ডকুমেন্ট.গেটমেন্টবাইআইডি () ব্যবহার করি।

Answer 14

কারণ কেস [২] document.myForm.fooইন্টারনেট এক্সপ্লোরার থেকে একটি উপভাষা। সুতরাং এটির পরিবর্তে, আমি পছন্দ করি document.forms.myForm.elements.fooবা করি document.forms["myForm"].elements["foo"]।

Answer 15

আমি এই এক পছন্দ

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

Comments

এসও তে আপনাকে স্বাগতম, আমরা আপনার ইনপুটটির প্রশংসা করি। আপনার উত্তরটি সম্পাদনা করুন এবং কেন এবং কীভাবে তা ব্যাখ্যা করুন।

— বি - রিয়ান