toggleClass နည်းလမ်း

toggleClass နည်းလမ်းသည် CSS class ထည့်ခြင်း/ဖယ်ရှားခြင်းကို အပြန်အလှန်ပြုလုပ်ပေးသည် - မရှိပါက ထည့်ပေးမည်၊ ရှိပါက ဖယ်ရှားပေးမည်။

ဖွဲ့စည်းပုံ

CSS class တစ်ခု -

javascript$(selector).toggleClass(class name);

true သို့မဟုတ် false တန်ဖိုးများကို လက်ခံသော ဒုတိယ parameter အပေါ် မူတည်၍ CSS class ကို ထည့်ရန် သို့မဟုတ် ဖယ်ရှားရန် သာလုပ်ဆောင်ရန် -

javascript$(selector).toggleClass(CSS class name, state);

CSS class များစွာ -

javascript$(selector).toggleClass(['class1', 'class2', 'class3', '...']);

ဒုတိယ parameter အပေါ် မူတည်၍ CSS class များကို ထည့်ရန် သို့မဟုတ် ဖယ်ရှားရန် သာလုပ်ဆောင်ရန် -

javascript$(selector).toggleClass(['class1', 'class2', 'class3', '...'], state');

အစုထဲရှိ element တိုင်းအတွက် function ကို အသုံးပြုခြင်း၊ အခြေအနေသည် true သို့မဟုတ် false ဖြစ်နိုင်ပြီး CSS class ကို ထည့်ရန် သို့မဟုတ် ဖယ်ရှားရန် သာလုပ်ဆောင်ရန် နည်းလမ်းကို ညွှန်ပြသည် -

javascript$(selector).toggleClass(function(index in set, current classes of element, state), [state]);

ဥပမာ

ကျွန်ုပ်တို့၏ စာပိုဒ်တွင် class နှစ်ခု ရှိပြီးဖြစ်သည်။ ၎င်းကို www class ထပ်မံထည့်ကြည့်ရအောင် -

html<p id="test" class="eee ggg">စာသား</p>
javascript$('#test').toggleClass('www');

HTML ကုဒ်သည် အောက်ပါအတိုင်း ပေါ်လာမည် -

html<p id="test" class="eee ggg www">စာသား</p>

ဥပမာ

ယခုတွင် www class သည် element ထဲတွင် ရှိနေပြီ - ၎င်းကို ဖယ်ရှားကြည့်ရအောင် -

html<p id="test" class="eee ggg www">စာသား</p>
javascript$('#test').toggleClass('www');

HTML ကုဒ်သည် အောက်ပါအတိုင်း ပေါ်လာမည် -

html<p id="test" class="eee ggg">စာသား</p>

ဤသည်လည်း ကြည့်ပါ

  • addClass, removeClass, hasClass နည်းလမ်းများ
  • JavaScript property classList,
    အကူအညီဖြင့် စင်ကြယ်သော JavaScript တွင် class ထည့်ခြင်း/ဖယ်ရှားခြင်းကို အပြန်အလှန်ပြုလုပ်နိုင်သည်