এইচটিএমএল এলিমেন্টকে কিভাবে খুজে বের করতে হয় এবং এক্সেস করতে হবে তা এই পেজে শিখতে পারবো।
এইচটিএমএল এলিমেন্টকে খোঁজা
প্রায়ই আপনি জাভাস্ক্রিপ্ট দ্বারা একটি পেজের এইচটিএমএল এলিমেন্টকে নিয়ে কাজ করতে চাইবেন।
সেটা করার জন্য আপনাকে প্রথমে এলিমেন্টটিকে খুঁজে বের করতে হবে। একটি এলিমেন্টকে খুঁজে বের করার কয়েকটি উপায় রয়েছেঃ
- id দ্বারা এইচটিএমএল এলিমেন্টটিকে খুঁজে বের করা
- ট্যাগের নাম দ্বারা এইচটিএমএল এলিমেন্টটিকে খুঁজে বের করা
- class নাম দ্বারা এইচটিএমএল এলিমেন্টটিকে খুঁজে বের করা
- সিএসএস সিলেক্টর দ্বারা এইচটিএমএল এলিমেন্টটিকে খুঁজে বের করা
- এইচটিএমএল অবজেক্ট কালেকশন দ্বারা এইচটিএমএল এলিমেন্টটিকে খুঁজে বের করা
Id দ্বারা এইচটিএমএল এলিমেন্টকে খুঁজে বের করা
একটি এলিমেন্টকে ডোম এর ভেতর খুঁজে বের করার সবচেয়ে সহজ উপায় হলো এলিমেন্টের Id ব্যবহার করা।
নিচের উদাহরণে id="intro" যুক্ত এলিমেন্টটিকে খুঁজে বের করা হল:
kt_satt_skill_example_id=1342
যদি এলিমেন্টটি খুঁজে পাওয়া যায় তাহলে মেথডটি এলিমেন্টকে অবজেক্ট হিসেবে রিটার্ন করবে।
যদি এলিমেন্টটি খুঁজে পাওয়া না যায় তাহলে el ভ্যারিয়েবলটি খালি থাকবে।
ট্যাগের নাম দ্বারা এইচটিএমএল এলিমেন্টকে খুঁজে বের করা
নিচের উদাহরণে সকল <p> এলিমেন্টকে খুঁজে বের করা হলোঃ
kt_satt_skill_example_id=1344
নিচের এই উদাহরণটি প্রথমে id="main" যুক্ত এলিমেন্টকে খুঁজে বের করবে এবং তারপর "main" এর মাঝের সকল <p> এলিমেন্টকে খুঁজে বের করবেঃ
kt_satt_skill_example_id=1345
Class নামের দ্বারা এইচটিএমএল এলিমেন্টকে খুঁজে বের করা
আপনি যদি একই নামের Class যুক্ত এইচটিএমএল এলিমেন্টটিকে খুঁজে বের করতে চান তাহলে getElementsByClassName() ব্যবহার করুন।
নিচের এই উদাহরনটিতে class="para" যুক্ত সকল এলিমেন্টকে রিটার্ন করে।
kt_satt_skill_example_id=1348
Class এর নাম দ্বারা এলিমেন্টকে খুঁজে বের করা, IE8 এবং এর আগের ভার্সনগুলোতে সাপোর্ট করে না।
CSS সিলেক্টর দ্বারা এইচটিএমএল এলিমেন্টকে খুঁজে বের করা
আপনি যদি নির্দিষ্ট সিএসএস সিলেক্টরযুক্ত(যেমনঃ id, class , type, এট্রিবিউট, এট্রিবিউটের ভ্যালু ইত্যাদি) সকল এইচটিএমএল এলিমেন্টকে খুঁজতে চান তবে querySelectorAll() মেথডটি ব্যবহার করুন।
নিচের এই উদাহরনটিতে class="para" যুক্ত সকল <p> এলিমেন্টকে রিটার্ন করে।
kt_satt_skill_example_id=1349
querySelectorAll() মেথড দ্বারা এলিমেন্টকে খুঁজে বের করা, IE8 এবং এর আগের ভার্সনগুলোতে সাপোর্ট করে না।
এইচটিএমএল অবজেক্ট কালেকশন দ্বারা এইচটিএমএল এলিমেন্টকে খুঁজে বের করা
নিচের এই উদাহরণটিতে ফর্ম কালেকশনের মধ্য থেকে id="myForm" যুক্ত ফর্ম এলিমেন্টকে খুঁজে বের করে এবং সকল এলিমেন্টের ভ্যালু প্রদর্শন করে:
kt_satt_skill_example_id=1350
নিচের এই এইচটিএমএল অবজেক্টকেও এক্সেস করা যায়ঃ
kt_satt_skill_example_id=1352
- document.body
kt_satt_skill_example_id=1354
- document.documentElement
kt_satt_skill_example_id=1355
- document.embeds
kt_satt_skill_example_id=1356
- document.forms
kt_satt_skill_example_id=1359
- document.head
kt_satt_skill_example_id=1361
- document.images
kt_satt_skill_example_id=1365
- document.links
kt_satt_skill_example_id=1366
- document.scripts
kt_satt_skill_example_id=1367
- document.title
kt_satt_skill_example_id=1368
Read more
