classList වස්තුවේ toggle ක්‍රමය

classList වස්තුවේ toggle ක්‍රමය අංගයක නිශ්චිත CSS පන්තිය ප්‍රත්යාවර්ත කරයි: පන්තිය නොමැති නම් එය එක් කරන අතර, පවතී නම් ඉවත් කරයි.

වාග් රීතිය

javascriptelement.classList.contains(class);

උදාහරණය

මෙම උදාහරණයේ, toggle ක්‍රමය භාවිතා කිරීමේදී zzz පන්තිය අංගයේ දැනටමත් පවතින නිසා ඉවත් වේ:

html<p id="elem" class="www ggg zzz"></p>
javascriptlet elem = document.querySelector('#elem');
elem.classList.toggle('zzz');

කේතය ක්‍රියාත්මක කිරීමේ ප්‍රතිඵලය:

html<p id="elem" class="www ggg"></p>

උදාහරණය

මෙම උදාහරණයේ, toggle ක්‍රමය භාවිතා කිරීමේදී zzz පන්තිය අංගයේ නොමැති නිසා එක් වේ:

html<p id="elem" class="www ggg"></p>
javascriptlet elem = document.querySelector('#elem');
elem.classList.toggle('zzz');

කේතය ක්‍රියාත්මක කිරීමේ ප්‍රතිඵලය:

html<p id="elem" class="www ggg zzz"></p>

මෙයද බලන්න

  • classList.add ක්‍රමය,
    නිශ්චිත පන්තියක් එක් කරයි
  • classList.remove ක්‍රමය,
    නිශ්චිත පන්තියක් ඉවත් කරයි
  • classList.contains ක්‍රමය,
    නිශ්චිත පන්තියක් පරීක්ෂා කරයි