تحديد وجود فئة العنصر في JavaScript

عند فحص سمات فئة العنصر، غالبًا ما يكون من الضروري التحقق مما إذا كان يحتوي على فئة معينة. يستخدم التعليمة البرمجية المقدمة عبارة تبديل لفحص قيمة فئة العنصر بالضبط، ولكن هذا الأسلوب يفشل في الكشف عن التطابقات الجزئية.

لحل هذا القيد، خذ في الاعتبار استخدام الأسلوب element.classList .contains. تقبل هذه الطريقة اسم فئة كمعلمة وترجع قيمة منطقية تشير إلى وجودها ضمن قائمة فئات العنصر:

element.classList.contains(class);

هذه الطريقة مدعومة عالميًا عبر الأنظمة الحديثة المتصفحات ويوفر طريقة متسقة للتحقق من تضمين الفصل.

بدلاً من ذلك، للتوافق مع المتصفحات الأقدم التي تفتقر إلى الأسلوب .contains، يمكنك استخدام الإصدار المعدل التالي من طريقة الفهرس:

function hasClass(element, className) {
    return (' '   element.className   ' ').indexOf(' '   className   ' ') > -1;
}

يضمن هذا التعديل اكتشاف التطابقات الجزئية بدقة، وتجنب النتائج الإيجابية الخاطئة عندما يكون الفصل الذي تبحث عنه جزءًا من اسم فئة أكبر.

تطبيق هذه الطريقة على المثال المقدم:

var test = document.getElementById("test"),
    classes = ['class1', 'class2', 'class3', 'class4'];

test.innerHTML = "";

for(var i = 0, j = classes.length; i 
من خلال استخدام طريقة .contains أو وظيفة IndexOf المعدلة، يمكنك تحديد ما إذا كان العنصر يحتوي على فئة معينة في JavaScript بشكل موثوق، بغض النظر عن توافق المتصفح أو وجود تطابقات جزئية.