الفرق بين classList و setAttribute في جافا سكريبت؟

الدالة setAttribute تستخدم لإضافة أى صفة خاصة بالعنصر ولا تقتصر علي ال class فقط . 

فيمكنك إضافة إسم للعنصر أو حتى جعله غير مفعل .

el.setAttribute("name", "Any_Name");
el.setAttribute("disabled", "");

وهذه الدالة تقوم بمسح القيمة القديمة للصفة وتوضع القيمة الجديدة فإذا قمنا باستخدام صفة class 

فسوف تقوم بمسح جيمع ال classes الخاصة بالعنصر واضافة ما تم ارساله لها 

za.setAttribute("class", "one");  // هنا سوف تقوم بمسح جميع لاصناف ووضع الصنف one فقط

إذا الكود السابق سوف يقوم بمسح جميع الاصناف ووضع الصنف one فقط .

اما بالنسبة للخاصية classList فهي خاصة بالعنصر للتلاعب بالاصناف وتحتوى على دوال كثيرة تسهل العمل .

contslide.classList.add('one') // هنا سوف تقوم بإضافة الصنف onde على باقى الاصناف 


contslide.classList.remove('one') //  هنا سوف تقوم بحذف الصنف فقط 




contslide.classList.toggle('one')  // هنا سوف تقوم بحذف الصنف إذا وجد أو ستقوم بإضافته إذا لم يوجد

هنا في أول سطر سوف تقوم بإضافة الصنف one الى قائمة الاصناف وبذلك لن يفقد العنصر الاصناف الخاصة به .

إذا فإن الفرق بينهم هو ان setAtrribute ستقوم بحذف باقى الاصناف واضافة الصنف المرسل لها فقط .

و classList.add ستقوم بالحفاظ على الاصناف السابقة مع إضافة الصنف الجديد .

ولذلك فإن الافضل هو استخدام classList لاحتوائها على اكثر من دالة تقوم بتسهيل العمل وخاصة بالاصناف فقط