گروه مقاله : جاوا اسكريپت Java Script
تاريخ انتشار : 1396/04/14 - 12:43
كد :7684

فعال و غیر فعال کردن کلاس در W3

شما میتوانید با استفاده از دستور toggleClass کلاس های عناصر را فعال و غیر فعال کرده و یا در واقع حذف و فراخوانی کنید.

فعال و غیر فعال کردن کلاس در W3

 

در ادامه آموزش کتابخانه W3.js  به نحوه روشن و خاموش کردن کلاس ها خواهیم پرداخت.

 

تغییر وضعیت کلاس با ID

برای تغییر وضعیت کلاس "marked" از شناسه عنصر بصورت id="London" استفاده می کنیم.

مثال:

<button onclick="w3.toggleClass('#London','marked')">Toggle</button>

مشاهده نتیجه

 

تغییر وضعیت کلاس با نام تگ

تغییر وضعیت کلاس "marked"  برای همه تگهای <h2> :

مثال:

<button onclick="w3.toggleClass('h2','marked')">Toggle</button>

مشاهده نتیجه

 

تغییر وضعیت کلاس با نام کلاس

تغییر وضعیت کلاس "marked" در همه المان های دارای کلاس  class="city"

مثال:

<button onclick="w3.toggleClass('.city','marked')">Toggle</button>

مشاهده نتیجه

 

تغییر وضعیت چند کلاس بصورت همزمان

تغییر وضعیت کلاس های class1 و class2 در عنصر دارای شناسه id="London”  

مثال:

<button onclick="w3.toggleClass('#London','class1','class2')">Toggle</button>

مشاهده نتیجه

 

شرکت سارگون مجری تخصصی طراحی سایت با ما تماس بگیرید.

نظرات كاربران :