illustrator Curse
  • 7Learn Android Course
  • 7Learn SEO Course
  • 7Learn WP Theme Course

    حرفه ای ترین دوره آموزش طراحی قالب وردپرس



  آیا می دانید دوره های آموزشی سون لرن از جامع ترین و کاربردی ترین آموزش های موجود در سطح وب فارسی است!

ترفندهای پیشرفته برای Inspector مرورگر Chrome (قسمت 15) : سوئیچ کردن کلاس و نقاط شکست شرطی

0 144 ۲۹ شهریور ۹۵

inspector

ترفند 28 : Toggle کردن کلاسهای یک المنت

همونطور که میدونید یک المنت میتونه کلاسهای متنوعی رو بگیره و متناسب با هر کدوم، در صفحه نمایش داده بشه. شما میتونین برای تست کردن سریع این کلاسها رو گذاشته و بردارید و تاثیر اونا رو فورا در مرورگر ببینید. در ابتدا به سایت w3schools میریم و Inspector رو در اون باز میکنیم.inspector toggle class

همونطور که دیدید یک المنت رو انتخاب کردیم. حالا میتونیم کلاسهای اون رو برداشته و اونا رو تست کنیم:inspector toggle class 2

همچنین میتونین درون باکسی که موجود هست و Add new class نوشته شده، نام یک کلاس جدید رو نوشته و اینتر بزنید تا اون هم به لیست کلاسهای شما اضافه بشه.

ترفند 29 : Inspect کردن خود Inspector

همونطور که میدونین همیشه ما المنتهایی که درون صفحه هستن رو Inspect میکنیم و تغییرات مورد نظرمون رو بر روی اون انجام میدیم. حالا در اینجا برای سرگرمی میخایم خود Inspector رو Inspect کنیم. برای اینکار Inspector رو باز میکنیم و بر روی آیکون زیر کلیک میکنیم، تا بصورت یک پنجره مستقل در بیاد:inspector toggle class 2

حالا که Inspector در یک پنجره مجزا باز شد، کلیدهای ترکیبی ctrl + shift + i رو میزنیم، تا Inspector برای این Inspector باز بشه. حالا میتونیم هر تغییری که بخایم بر روی اون اجرا کنیم. بصورت زیر:inspect the inspector

دیدید که به راحتی این کار رو انجام دادیم.

ترفند 30 : ایجاد نقاط شکست شرطی

همونطور که میدونید شما میتونین با قرار دادن نقاط شکست یا breakpoint کدهاتون رو به راحتی عیب یابی و تست کنید. فرض کنید یک سایت رو باز میکنیم که فایل new.js یکی از فایلهای Javascript اون هست. اگر Inspector رو باز کرده و تب Source رو نگاه کنیم، بصورت زیر هست:insert breakpoint

حالا شما میتونین درون فایل new.js روی شماره هر خط کلیک کنید تا به اون خط یک breakpoint اضافه کنید. مفسر زبان Javascript به هر خطی که نقطه شکست داشته باشه برسه، برنامه بصورت اتوماتیک متوقف میشه و شما میتونین با دقت بیشتری اون رو بررسی کنید. insert breakpoint

همونطور که دیدین به سادگی با کلیک میتونیم یک نقطه شکست رو اضافه یا حذف کنیم. حالا فرض کنید بخایم کاری کنیم که این نقاط شکست فقط در شرایطی خاص باعث متوقف شدن برنامه بشن. برای اینکار میتونیم از نقاط شکست شرطی استفاده کنیم. فرض کنید میخام فقط زمانی که آرگومان num بیشتر از 2 بود، برنامه متوقف بشه. برای اینکار میتونیم بصورت زیر عمل کنیم:insert breakpoint 2

همونطور که دیدین برای اعداد 1 و 2 برنامه متوقف نشد و زمانی که بیشتر از 2 شد برنامه متوقف شد. همچنین نقاط شکست عادی نارنجی و نقاط شکست شرطی آبی رنگ هستن.

امیدوارم از این مطلب خوشتون اومده باشه.

موفق باشید

یا علی

:: مطالب جدید سون لرن را از طریق ایمیل دریافت کنید :

دیدگاه ها اولین دیدگاه این مطلب را ارسال کنید.

ارسال دیدگاه

ورود/عضویت سریع با اکانت فیسبوک/جیمیل شما

:: شما می توانید با استفاده از اکانت یاهو یا جیمیل خود به صورت کاملا امن، سریع و بدون نیاز به ورود اطلاعات عضو و وارد سایت شوید. در این صورت هیچ نیازی به ورود نام کاربری و رمز عبور خود نخواهید داشت و هویت شما از طریق ایمیلتان مورد تائید قرار می گیرد .
برای استفاده از این روش باید در اکانت گوگل(جیمیل) و یا یاهوی خود لاگین باشید .
عضویت/ ورود سریع با :
در حال اتصال ...

ورود به سایت

ورود سریع با :
در حال اتصال ...

جستجو در سون لرن

عبارت :
7LearnTelegram