”, প্রথম স্তরের শিরোনামের জন্য “
” ইত্যাদি বিষয়বস্তু ব্যাখ্যা করতে হয়। এই পদ্ধতির প্রয়োজন হয় যখন ব্যবহারকারীর ট্যাগ নামের দ্বারা একটি HTML উপাদান অ্যাক্সেস করতে হয়। কোডের একাধিক লাইন অনুসন্ধানের পরিবর্তে সরাসরি।
এই গাইড জাভাস্ক্রিপ্ট ব্যবহার করে একটি HTML উপাদানের ট্যাগ নাম আনার সম্পূর্ণ পদ্ধতি ব্যাখ্যা করবে।
কিভাবে জাভাস্ক্রিপ্ট ব্যবহার করে একটি HTML উপাদানের ট্যাগ নাম আনতে হয়?
জাভাস্ক্রিপ্ট শুধুমাত্র পঠনযোগ্য ' নাম যোগ করা ” সম্পত্তি যা সংশ্লিষ্ট HTML উপাদানের ট্যাগ নাম প্রদর্শন করে। এটি একটি স্ট্রিং মান প্রদান করে যেমন, UPPERCASE এ উপাদানটির ট্যাগ নাম।
বাক্য গঠন
উপাদান নাম যোগ করা
উপরের সিনট্যাক্সে, ' নাম যোগ করা ” উপাদানের ট্যাগ নামের সাথে মিলে যায় যা আনতে হবে।
এখন, সংশ্লিষ্ট HTML উপাদানের ট্যাগ নাম আনতে কীভাবে এটি ব্যবহার করা যেতে পারে তা পরীক্ষা করার জন্য এর ব্যবহারিক বাস্তবায়নের দিকে এগিয়ে যাওয়া যাক।
উদাহরণ: একটি HTML উপাদানের ট্যাগ নাম আনার জন্য 'ট্যাগনাম' প্রপার্টি প্রয়োগ করা
এই উদাহরণে, এইচটিএমএল কোডে নির্দিষ্ট করা সমস্ত উপাদানের ট্যাগ নাম 'এর মাধ্যমে আনা যেতে পারে নাম যোগ করা 'সম্পত্তি।
HTML কোড
চলুন নিচের HTML কোড গুলো দেখে নেই:
< শরীর অনক্লিক = 'elemName()' >< h2 > জাভাস্ক্রিপ্টে HTML এলিমেন্টের ট্যাগনাম আনুন < / h2 >
< পি > ট্যাগ নাম পেতে এই নথির যেকোনো উপাদানে ক্লিক করুন। < / পি >
< বোতাম > এটি ক্লিক করুন < / বোতাম >
< পি আইডি = 'ডেমো' < / পি >
কোডের উপরের লাইনগুলিতে:
- দ্য ' ' ট্যাগ একটি ' এর সাথে যুক্ত অনক্লিক 'ইভেন্ট জাভাস্ক্রিপ্ট ফাংশনে পুনঃনির্দেশ করা হচ্ছে' elemName() যা একটি ক্লিকে ট্রিগার হবে।
- দ্য ' ” ট্যাগ উপশিরোনাম সংজ্ঞায়িত করে।
- দ্য ' ” ট্যাগ একটি অনুচ্ছেদ বিবৃতি তৈরি করে।
- দ্য ' <বোতাম> ' ট্যাগ 'এটি ক্লিক করুন' নামে একটি বোতাম যোগ করে।
- সবশেষে, ' ' ট্যাগ একটি আইডি সহ একটি খালি অনুচ্ছেদকে সংজ্ঞায়িত করে ' ডেমো 'অনক্লিক' ইভেন্ট ট্রিগারে HTML উপাদান ট্যাগ নাম প্রদর্শন করতে।
জাভাস্ক্রিপ্ট কোড
পরবর্তীতে নীচের প্রদত্ত কোডে যান:
< লিপি >ফাংশন elemName ( ) {
const উপাদান = ঘটনা লক্ষ্য ;
নথি getElementById ( 'ডেমো' ) . innerHTML = 'ক্লিক করা HTML এলিমেন্ট ট্যাগের নাম হল: ' + উপাদান নাম যোগ করা ;
}
লিপি >
এই কোড ব্লকে:
- 'নামক একটি ফাংশন সংজ্ঞায়িত করুন elemName() ”
- এর সংজ্ঞায়, পরিবর্তনশীল ঘোষণা করুন “ উপাদান 'ডাটা টাইপের' const 'যা ব্যবহার করে' লক্ষ্য ' উপাদানের নাম ফেরত দেওয়ার জন্য সম্পত্তি যখন এর সম্পর্কিত ইভেন্ট ট্রিগার হয়।
- অবশেষে, প্রয়োগ করুন ' getElementById() ” এর আইডি ব্যবহার করে যোগ করা অনুচ্ছেদ অ্যাক্সেস করার পদ্ধতি।
- এটি ব্যবহার করে সংশ্লিষ্ট HTML উপাদানের ট্যাগ নাম প্রদর্শন করবে নাম যোগ করা ' সম্পত্তি যখন 'অনক্লিক' ইভেন্ট ফায়ার হবে।
- এটি এমন যে এইচটিএমএল কোডের যেকোনো উপাদানে ক্লিক করার পরে, সংশ্লিষ্ট ট্যাগ নামটি পুনরুদ্ধার করা হবে।
আউটপুট
আউটপুট সংশ্লিষ্ট উপাদান ট্যাগের নাম দেখায় যেখানে 'অনক্লিক' ইভেন্টটি সেই অনুযায়ী ফায়ার হয়।
উপসংহার
জাভাস্ক্রিপ্ট বিল্ট-ইন প্রদান করে ' নাম যোগ করা HTML উপাদান ট্যাগ নাম পাওয়ার জন্য সম্পত্তি। এটি সাধারণত জাভাস্ক্রিপ্ট ইভেন্ট হ্যান্ডলারের সাথে ব্যবহার করা হয় যেমন “onclick”, “onmouseover”, “ondblclick” ইত্যাদি। যখন HTML এলিমেন্টের সংশ্লিষ্ট ইভেন্টটি ফায়ার হয়, তখন এটি ডিফল্টরূপে UPPERCASE-এ তার ট্যাগ নাম ফেরত দেয়। এই নির্দেশিকা জাভাস্ক্রিপ্ট ব্যবহার করে একটি HTML উপাদানের ট্যাগ নাম কিভাবে আনতে হয় তার একটি সংক্ষিপ্ত বিবরণ প্রদান করেছে।