کنترل CSS با جاوا اسکریپت

جاوا اسکریپت دسترسی کامل به نشانه گذاری یک صفحه وب (DOM) و سبک های یک صفحه (CSSOM) دارد. استفاده از جاوا اسکریپت برای تعامل با و دستکاری DOM تمرین معمول است، اما استفاده از جاوا اسکریپت برای ارتباط با CSS به ندرت از لایه های کم عمق کلاسهای دستکاری و تزریق سبک های درون خطی استفاده می شود. در این دوره، Morten Rand-Hendriksen یک شیرجه عمیق را به تقاطع جاوا اسکریپت و CSS می برد تا ببینید چه چیزی ممکن است.

او به بررسی دستکاری پایه CSSOM می پردازد تا سبک های زنده یک سایت را تغییر دهد، به فرصت های جدیدی که توسط خواص سفارشی ارائه می شود، به نظر می رسد و مفاهیم مانند نشانه های سبک را بررسی می کند. همانطور که مورتن نشان می دهد، با استفاده از جاوا اسکریپت به کنترل CSS درب را به طرح های تعاملی بیشتر و تجربیات کاربر باز می کند و به طراحان و توسعه دهندگان اجازه می دهد تا کارهایی را تنها با CSS انجام دهند.

عنوان اصلی : Controlling CSS with JavaScript

سرفصل های دوره :

مقدمه:
فرصت های جدید در تقاطع CSS و جاوا اسکریپت
فایل های ورزشی
1. دسترسی به سبک ها و سبک های سبک:
دسترسی به تمام صفحات سبک در یک سند
پیدا کردن ورق سبک خاص در یک سند
یک ورق سبک را با استفاده از جاوا اسکریپت غیرفعال کنید
قوانین دسترسی از یک ورق سبک
قوانین را از یک صفحه سبک وارد کنید و حذف کنید
Challenge: Switcher StyleSheet
راه حل: Switcher StyleSheet
2. کار با قوانین سبک:
یک قانون سبک را تغییر دهید
پیدا کردن چه سبک هایی برای یک عنصر محاسبه می شود
اضافه کردن سبک های جدید درون خطی به یک عنصر
دسترسی به سبک عناصر inline
سبک های درمان به عنوان ویژگی های عنصر
3. کار با خواص:
دسترسی به اعلامیه یک قانون خاص CSS
ارزش مالکیت خاصی را دریافت کنید
مقدار اموال موجود را تنظیم کنید یا یک ملک جدید ایجاد کنید
حذف یک ملک خاص از یک قانون
مدل شیء CSS تایپ شده
ایجاد و دسترسی به قوانین سبک با اموال STYLEMAP
ایجاد / دسترسی به سبک های عناصر inline با attributestylemap
چالش: چرخش جعبه
راه حل: جعبه را بچرخانید
4. کار با خواص سفارشی:
دسترسی به خواص سفارشی
ارزش ارزش های سفارشی را تنظیم کنید
درک خواص سفارشی ثبت شده
تعریف خواص سفارشی ثبت شده
چالش: انتخاب رنگ
راه حل: انتخاب رنگ
نتیجه گیری:
API های جدید تحت توسعه