الانتقال إلى المحتوى الرئيسي

كيفية إزالة فئة في جافا سكريبت: دليل لإزالة فئة من عنصر هتمل

  • الدكتور مسرور بنو سعد بن ليث بن بكر
  • المدونة

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

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

مثال على استخدام قائمة الفصل.طريقة الإزالة:

عنصر فار = وثيقة.جيتليمينتبيد ("مياليمنت");

عنصر.قائمة الفصل.إزالة ("ميكلاس");

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

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

  1. كيفية حذف فئة في جافا سكريبت
  2. طرق حذف فئة
  3. مثال الاستخدام
  4. كيفية إزالة فئة من عنصر هتمل
  5. 1. باستخدام قائمة الفصل.إزالة () طريقة
  6. 2. باستخدام خاصية كلاسنام
  7. 3. باستخدام سمة قائمة الفئات
  8. باستخدام قائمة الفصل.إزالة () طريقة
  9. كتابة وظيفة لحذف فئة
  10. التطبيق العملي
  11. سؤال وجواب

كيفية حذف فئة في جافا سكريبت

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

طرق حذف فئة

في جافا سكريبت ، هناك العديد من الطرق التي تسمح لك بإزالة فئة من عنصر هتمل. دعونا ننظر إلى بعض منهم:

  1. : تسمح لك هذه الطريقة بإزالة فئة واحدة أو أكثر من عنصر هتمل. لحذف فئة ، قم بتمرير اسمها كوسيطة إلى الطريقة.
  2. مثال الاستخدام:
    عنصر.قائمة الفصل.إزالة ('اسم الفئة');
  3. .
  4. مثال الاستخدام:
    عنصر.اسم الفئة = عنصر.اسم الفصل.يستبدل ("اسم الفئة"،");
  5. : تسمح لك هذه الطريقة بتبديل الفصل بين الإضافة والإزالة. إذا كان الفصل موجودا بالفعل ، فإن الطريقة تحذفه ، والعكس صحيح.
  6. مثال الاستخدام:
    عنصر.قائمة الفصل.تبديل ('اسم الفئة');

مثال الاستخدام

لنفترض أن لدينا عنصر هتمل التالي:

ونريد إزالة الطبقة الحمراء من هذا العنصر في جافا سكريبت:

فار النخاع = وثيقة.جيتليمينتبيد ('مياليمنت');

الفصل

من عنصر هتمل:

وبالتالي ، قمنا بحذف الفصل بنجاح باستخدام

قائمة الفصل.إزالة () طريقة

.

آمل أن يكون هذا المثال ساعد على فهم كيفية إزالة فئة من عنصر هتمل في جافا سكريبت.

كيفية إزالة فئة من عنصر هتمل

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

1. باستخدام قائمة الفصل.إزالة () طريقة

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

يوضح المثال التالي كيفية استخدام قائمة الفئات.إزالة () طريقة لإزالة فئة من عنصر هتمل:

دع العنصر = المستند.جيتليمينتبيد ("مياليمنت");

عنصر.قائمة الفصل.إزالة ("ميكلاس");

2. باستخدام خاصية كلاسنام

تمثل خاصية اسم الفئة سلسلة تحتوي على جميع فئات العنصر. لحذف فئة معينة ، يمكنك حذفها من هذا السطر.

هنا مثال على استخدام خاصية كلاسنام لإزالة فئة من عنصر هتمل:

دع العنصر = المستند.جيتليمينتبيد ("مياليمنت");

عنصر.اسم الفئة = عنصر.اسم الفصل.يستعاض عن ("ميكلاس"،"");

في هذا المثال ، نستخدم طريقة الاستبدال () لاستبدال فئة بسلسلة فارغة ، وبالتالي إزالتها من السلسلة بالفئات.

3. باستخدام سمة قائمة الفئات

يمكنك أيضا الحصول على سمة فئة عنصر وإزالة الطبقة منه.

هنا مثال على استخدام سمة الفئة لإزالة فئة من عنصر هتمل:

دع العنصر = المستند.جيتليمينتبيد ("مياليمنت");

دع الطبقات = عنصر.جيتاتريبوت ("فئة");

الطبقات = الطبقات.يستعاض عن ("ميكلاس"،"");

عنصر.سيتاتريبوت ("فئة" ، فئات);

في هذا المثال ، نحصل أولا على سمة الفئة للعنصر ، ثم نستخدم طريقة الاستبدال() لإزالة الفئة من الصف المقابل لسمة الفئة. ثم نقوم بتعيين القيمة المحدثة لسمة الفئة مرة أخرى إلى العنصر.

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

، ثم حدد

مثال على استخدام الطريقة

قائمة الفصل.إزالة()

:

// عنصر هتمل

عنصر فار = وثيقة.جيتليمينتبيد ("مياليمنت");

// يزيل الفئة "النشطة" من القائمة

من فئات العناصر.قائمة الفصل.إزالة ("نشط");

في المثال أعلاه,

من المهم ملاحظة أنه إذا كانت فئة مفقودة من قائمة فئات عنصر ما ، فقم بحذفها باستخدام الطريقة

باستخدام الطريقة

قائمة الفصل.إزالة()

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

كتابة وظيفة لحذف فئة

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

هنا مثال على وظيفة بسيطة لحذف فئة:

وظيفة ريموفكلاس (العنصر ، كلاسنام) {

عنصر.قائمة الفصل.إزالة (اسم الفئة);

  1. }

  2. هناك نوعان من المعلمات في هذه الوظيفة:

داخل الوظيفة

، قائمة الفصل.يتم استخدام طريقة إزالة ()

لإزالة الطبقة من العنصر. يزيل الفئة المحددة من قائمة فئات العناصر. إذا لم يكن هناك فصل ، فلن يحدث شيء.

هنا مثال على استخدام الدالة لحذف فئة:

// نحصل على العنصر الذي نحتاج إلى حذف الفصل منه

عنصر فار = وثيقة.جيتليمينتبيد ("مياليمنت");

في هذا المثال ، نحصل على عنصر مع معرف "مياليمنت" واستخدام

وظيفة ريموفكلاس ()

لحذف الطبقة "النشطة". بعد تنفيذ هذا الرمز ، سيتم حذف الفئة" النشطة " من هذا العنصر.

وهكذا ، كتابة وظيفة لحذف فئة يجعل من السهل ومريحة لحذف الطبقات من عناصر هتمل في جافا سكريبت ، والتي توفر إدارة نمط مرنة والتفاعل مع واجهة المستخدم.

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

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

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