এই নিবন্ধটি জাভাস্ক্রিপ্টে বিষয়বস্তু সম্পাদনাযোগ্য পরিবর্তন ইভেন্টগুলি কীভাবে পরিচালনা করতে হয় তা নিয়ে আলোচনা করে এবং একটি উদাহরণের সাহায্যে এটি ব্যাখ্যা করে।
জাভাস্ক্রিপ্টে কনটেন্টেটেবল পরিবর্তন ইভেন্টগুলি কীভাবে পরিচালনা করবেন?
বিষয়বস্তু সম্পাদনাযোগ্য একটি গণিত বৈশিষ্ট্য। ব্যবহারকারী তাদের প্রয়োজনীয়তা বিবেচনা করে বিষয়বস্তু পরিবর্তন করতে পারেন. যদি এটি অনুমোদিত হয়, ব্রাউজার উপাদানগুলি পরিবর্তন করার অনুমতি দিতে তার উইজেট পরিবর্তন করে।
একটি বিষয়বস্তু সম্পাদনাযোগ্য পরিবর্তন ইভেন্ট দ্বারা কোন মানগুলি অনুমোদিত?
বিষয়বস্তু সম্পাদনাযোগ্য এই মানগুলির যেকোনো একটি নিতে পারে:
- প্লেইন-টেক্সট শুধুমাত্র প্রতিনিধিত্ব করে যে মূল পাঠ্যটি সম্পাদনা করা যেতে পারে যদিও সমৃদ্ধ পাঠ্য বিন্যাস অক্ষম করা হয়েছে।
- একটি খালি স্ট্রিং বা সত্য যার অর্থ উপাদানটি সম্পাদনা করা যেতে পারে।
- মিথ্যা বোঝায় যে উপাদানটি সম্পাদনা করা যাবে না।
উদাহরণ
নিম্নলিখিত উদাহরণ ব্যাখ্যা করে কিভাবে একটি ওয়েব পৃষ্ঠায় সম্পাদনাযোগ্য সামগ্রী ব্যবহার করা যেতে পারে৷ আসুন এটি আরও ভালভাবে বোঝার জন্য নীচের কোডটি দেখি:
এইচটিএমএল
এখানে একটি HTML কোড রয়েছে যা বিষয়বস্তু সম্পাদনাযোগ্য পরিবর্তন ইভেন্টগুলির ব্যবহার ব্যাখ্যা করে:
< ব্লককোট সন্তোষজনক = 'সত্য' >
< h3 > এখানে আপনার বিষয়বস্তু সম্পাদনা করুন! < / h3 >
< / ব্লককোট >
উপরের HTML কোডে:
- একটি ব্লককোট ট্যাগ তৈরি করা হয়েছে বিষয়বস্তু সম্পাদনাযোগ্য এট্রিবিউটটি সত্যে সেট করে। এটি ব্লককোট ট্যাগের ভিতরের বিষয়বস্তুকে সম্পাদনা করতে সক্ষম করবে।
- ব্লককোট ট্যাগের ভিতরে একটি h3 ট্যাগ রয়েছে। এটি 'আপনার সামগ্রী এখানে সম্পাদনা করুন!' বলে, কারণ এটি
-এর ভিতরে উপস্থিত রয়েছে, যার অর্থ ব্যবহারকারী দ্বারা সামগ্রীটি সম্পাদনা করা যেতে পারে৷
সিএসএস
আমাদের কোডটি দৃশ্যত আকর্ষণীয় করতে, আমরা নিম্নলিখিত CSS কোড ব্যবহার করেছি:
ব্লককোট {
পটভূমি : পিচপাফ ;
সীমানা-ব্যাসার্ধ : 10px ;
মার্জিন : 10px ;
}
ব্লককোট h3 {
প্যাডিং : 10px ;
}
উপরের CSS কোডে:
- ব্লককোট ট্যাগ ব্যাকগ্রাউন্ডে 10px এর সীমানা-ব্যাসার্ধ এবং 10px এর মার্জিন সহ একটি পীচ রঙ সেট করা হয়েছে।
- ব্লককোটের ভিতরে h3 শিরোনামটি 10px এর প্যাডিং সেট করা আছে।
আউটপুট :
নিম্নলিখিত আউটপুট ব্যাখ্যা করে কিভাবে জাভাস্ক্রিপ্টে বিষয়বস্তু সম্পাদনাযোগ্য পরিবর্তন ইভেন্ট ব্যবহার করে বিষয়বস্তু সম্পাদনা করা যেতে পারে:
বিষয়বস্তু সম্পাদনার গুরুত্ব
- বর্ধিত ইন্টারঅ্যাক্টিভিটি যেহেতু ব্যবহারকারী সুবিধামত বিষয়বস্তু পরিবর্তন করতে পারে।
- জাভাস্ক্রিপ্টের সাহায্যে প্রোগ্রামার হিসাবে সুবিধাজনক কাস্টমাইজেশন স্বয়ংক্রিয় সংরক্ষণের মতো পরিবর্তিত আচরণ তৈরি করতে পারে, ব্যবহারকারীর ইনপুটের উপর ভিত্তি করে বিভিন্ন অ্যাকশন ট্রিগার করে।
- ব্যবহারকারীকে একটি পৃথক পাঠ্য ক্ষেত্রের প্রয়োজন ছাড়াই গতিশীলভাবে সম্পাদনা করার অনুমতি দিয়ে সম্পাদনা প্রক্রিয়াটিকে স্ট্রিমলাইন করতে সহায়তা করে।
উপসংহার
জাভাস্ক্রিপ্টের বিষয়বস্তু সম্পাদনাযোগ্য পরিবর্তন ইভেন্টগুলি ব্যবহারকারীকে ওয়েবপৃষ্ঠাটিকে প্রতিক্রিয়াশীল এবং কাস্টমাইজযোগ্য করে বিষয়বস্তু পরিবর্তন করতে সক্ষম করে। এটি ব্যবহারকারী-কেন্দ্রিক ওয়েব বিকাশের পথ প্রশস্ত করে যেখানে একজন ব্যবহারকারী আরও প্রতিক্রিয়াশীল ব্যবহারকারীর অভিজ্ঞতা সক্ষম করে রিয়েল-টাইমে একটি ওয়েব পৃষ্ঠার বিষয়বস্তু সম্পাদনা করতে পারে। এই নিবন্ধটি জাভাস্ক্রিপ্টে বিষয়বস্তু সম্পাদনাযোগ্য পরিবর্তন ইভেন্টগুলি কীভাবে পরিচালনা করতে হয় তা নিয়ে আলোচনা করেছে এবং একটি উদাহরণের সাহায্যে এটি ব্যাখ্যা করেছে।