Равиши toggleClass

Равиши toggleClass илова/тоза кардани CSS синфро ба таври алтернатӣ иҷро мекунад: агар вуҷуд надошта бошад - илова мекунад, агар вуҷуд дошта бошад - меҳадонад.

Синтаксис

Як CSS синф:

javascript$(селектор).toggleClass(номи синф);

Фақат илова ё тоза кардани CSS синф вобаста ба параметри дуюм, ки қиматҳои true ё false-ро қабул мекунад:

javascript$(селектор).toggleClass(номи CSS синф, ҳолат);

Бисёр CSS синфҳо:

javascript$(селектор).toggleClass(['синф1', 'синф2', 'синф3', '...']);

Фақат илова ё тоза кардани CSS синфҳо вобаста ба параметри дуюм:

javascript$(селектор).toggleClass(['синф1', 'синф2', 'синф3', '...'], ҳолат');

Истифодаи функсия барои ҳар як унсур дар маҷмӯъа, ҳолат метавонад true ё false бошад, ва ба равиш фармон медиҳад - фақат илова кунад ё фақат тоза кунад CSS синф:

javascript$(селектор).toggleClass(function(рақам дар маҷмӯъа, синфҳои ҷории унсур, ҳолат), [ҳолат]);

Намуна

Абзаси мо аллакай ду синф дорад. Биёед ба он синфи дигар ҳам, яъне синфи www-ро илова кунем:

html<p id="test" class="eee ggg">матн</p>
javascript$('#test').toggleClass('www');

HTML рамз ба ин шакл дар хоҳад омад:

html<p id="test" class="eee ggg www">матн</p>

Намуна

Ва акнун синфи www аллакай дар унсур вуҷуд дорад - биёед онро тоза кунем:

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 classList,
    ки бо ёрии он илова/тоза кардани синф дар JavaScript-и холис муяссар мегардад