কম্পিউটার

ভ্যানিলা জাভাস্ক্রিপ্টের সাহায্যে একটি উপাদান থেকে কীভাবে একটি ক্লাস সরানো যায়

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

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

সূত্র

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

উপরের জেনেরিক উদাহরণে, আমরা প্রথম HTML উপাদান পাই নির্দিষ্ট নির্বাচক নাম সহ একটি পৃষ্ঠায় (এটি একটি উপাদান নির্বাচক, শ্রেণি নির্বাচক, ইত্যাদি হতে পারে) এবং একটি পরিবর্তনশীল সহ এটির একটি রেফারেন্স সংরক্ষণ করুন৷

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

ব্যবহারিক classList.remove() উদাহরণ

একটি ক্লাস খুঁজে বের করতে এবং অপসারণ করতে, আমাদের অবশ্যই একটি উপাদান খুঁজে বের করতে হবে যার একটি ক্লাস আছে৷

তাহলে আমাদের কোন শ্রেণী অপসারণ করা উচিত?

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

আমাদের newfound classList.remove কৌশল দিয়ে উপরের অনুচ্ছেদটিকে "আন-ইটালিকাইজ" করা যাক:

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

এবং ফলাফল:

ভ্যানিলা জাভাস্ক্রিপ্টের সাহায্যে একটি উপাদান থেকে কীভাবে একটি ক্লাস সরানো যায়

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

.italic {
  font-style: italic;
}

সম্পদ

  • MDN ওয়েব ডক্স element.classList

  1. জাভাস্ক্রিপ্টের সাথে একটি উপাদানে একটি ক্লাসের নাম কীভাবে যুক্ত করবেন?

  2. জাভাস্ক্রিপ্টের সাথে একটি উপাদান থেকে একটি শ্রেণীর নাম যোগ এবং অপসারণের মধ্যে কিভাবে টগল করবেন?

  3. জাভাস্ক্রিপ্টের সাথে বর্তমান উপাদানটিতে কীভাবে একটি সক্রিয় ক্লাস যুক্ত করবেন?

  4. জাভাস্ক্রিপ্টের সাথে একটি উপাদান থেকে একটি ক্লাসের নাম কিভাবে সরাতে হয়?