كيفية تغيير class لعنصر في JavaScript؟ دليل كامل

مرحباً بالجميع! لقد بدأت للتو في تعلم JavaScript وواجهت مشكلة. لدي صفحة HTML تحتوي على عدة عناصر، وأحتاج إلى تغيير class الخاص بها ديناميكياً عند النقر أو أحداث أخرى. على سبيل المثال، هناك زر يجب أن يضيء عند الضغط عليه، أو كتلة يجب أن تختفي/تظهر. إليك الكود الخاص بي: ```html اضغط علي ``` أعلم أنه يمكن استخدام `className`، لكنني قرأت أن هذا ليس صحيحاً دائماً. جربت هكذا: ```javascript document.getElementById('myButton').onclick = function() { document.getElementById('myDiv').className = 'active'; }; ``` لكن هذا يعمل مرة واحدة فقط — إذا ضغطت مرة أخرى، لن تتم إزالة الـ class. وإذا كان العنصر يحتوي بالفعل على عدة classes، فسيتم مسحها جميعاً. كيف يمكن إضافة وإزالة وتبديل الـ classes بشكل صحيح؟ أحتاج إلى مثال كامل مع شرح. شكراً مقدماً! <<>>

استخدام classList — الطريقة الحديثة