ভ্যানিলা জাভাস্ক্রিপ্ট দিয়ে এলিমেন্ট থেকে ক্লাস সরানো

জাভাস্ক্রিপ্টের classList প্রোপার্টির remove() মেথড ব্যবহার করে HTML এলিমেন্ট থেকে ক্লাস সরানো খুব সহজ। যদি আপনি ইতিমধ্যে 'এলিমেন্টে ক্লাস যোগ করা' পড়ে থাকেন, তবে আপনি বুঝতে পারবেন ক্লাস সরানো ঠিক একই পদ্ধতি, শুধু উল্টো দিকে।

আসুন প্রথমে জেনেরিক classList.remove() ফর্মুলা দেখি — তারপর একটি প্র্যাকটিক্যাল উদাহরণ দিয়ে ব্যাখ্যা করব।

ফর্মুলা

var element = document.querySelector("selector") element.classList.remove("class")

উপরোক্ত জেনেরিক উদাহরণে, আমরা একটি পৃষ্ঠার প্রথম HTML এলিমেন্টটি নির্দিষ্ট সিলেক্টর নাম দিয়ে খুঁজে বের করি (এটি এলিমেন্ট সিলেক্টর, ক্লাস সিলেক্টর ইত্যাদি হতে পারে) এবং একটি ভেরিয়েবল দিয়ে এর রেফারেন্স সংরক্ষণ করি।

তারপর এলিমেন্ট অবজেক্টে (ভেরিয়েবল) classList প্রোপার্টির remove() মেথডটি যুক্ত করি এবং যে ক্লাসটি সরাতে চাই তা নির্দিষ্ট করি।

প্র্যাকটিক্যাল classList.remove() উদাহরণ

একটি ক্লাস খুঁজে বের করে সরানোর জন্য, আমাদের অবশ্যই একটি ক্লাস থাকা এলিমেন্ট খুঁজে বের করতে হবে।

তাহলে কোন ক্লাসটি সরাব?

আমাদের সুবিধার জন্য, আমি আপনি যা পড়ছেন সেই প্যারাগ্রাফে italic নামে একটি ক্লাস যোগ করেছি। আপনি দেখতে পাচ্ছেন, এটি টেক্সটটিকে ইট্যালিক করে দিচ্ছে।

আমাদের নতুন classList.remove কৌশল দিয়ে উপরের প্যারাগ্রাফটি "un-italicize" করি:

var firstParagraph = document.querySelector(".italic") firstParagraph.classList.remove("italic")

ফলাফল:

নোট: আমার ওয়েবসাইটের CSS স্টাইলশিটে italic ক্লাসটি আছে, তাই এটি কাজ করছে। ক্লাসটি এরকম দেখায়:

.italic { font-style: italic; }

রিসোর্স

• MDN Web Docs element.classList