বিভিন্ন রঙে সেল রং করা
পরবর্তী যৌক্তিক ধাপ হবে আমাদের সেলগুলো এলোমেলো রঙে রং করা। সমস্যার শর্ত অনুযায়ী আমাদের কাছে সীমিত সংখ্যক রঙের সেট আছে, ধরা যাক তিনটি: লাল, সবুজ, নীল।
যদি চিন্তা করা হয়, তাহলে এই রঙগুলোকে CSS ক্লাস বানানো সুবিধাজনক। আমরা আমাদের টেবিলের সেলগুলোতে এই ক্লাসগুলো দেব। আসুন সেগুলো বানাই:
.red {
background: red;
}
.green {
background: green;
}
.blue {
background: blue;
}
জাভাস্ক্রিপ্ট কোডে আমাদের ক্লাসগুলোকে একটি অ্যারেতে সংগ্রহ করা সুবিধাজনক:
let colors = ['red', 'green', 'blue'];
এরকম একটি অ্যারে থাকলে, আমরা আমাদের সমস্যার সমাধান করতে পারি: সেল তৈরির মুহূর্তে তাকে CSS দেব, আমাদের অ্যারে থেকে এলোমেলোভাবে এটি নির্বাচন করে।
এর জন্য একটি সহায়ক ফাংশন বানানো ভালো, যা প্যারামিটার হিসেবে অ্যারে নেবে এবং এর এলোমেলো এলিমেন্ট রিটার্ন করবে।
বর্ণিত ফাংশনটি বাস্তবায়ন করুন। এর কাজ পরীক্ষা করুন।
আপনার তৈরি করা ফাংশন ব্যবহার করে এমন করুন, যাতে টেবিল তৈরি করার সময় সেলগুলো এলোমেলো রঙে রং হয়।