فیلم اموزشی اینسپکت المنت (INSPECT ELEMENT) – جلسه 7

ترفندهای اینسپکت المنت

فیلم اموزشی اینسپکت المنت (INSPECT ELEMENT) – جلسه 7

با قسمت هفتم از فیلم اموزشی اینسپکت المنت (Inspect Element) در خدمتتون هستیم.

فیلم اموزشی اینسپکت المنت برای تمامی افرادی که با دنیای وب در ارتباط هستند مناسب است و هیچ محدودیتی در یادگیری وجود نداره.

درصورتی که قسمت های قبلی آموزش اینسپکت المنت را  هنوز مشاهده نکرده اید، میتوانید از زیر همین پست جلسات قبلی را دنبال نمایید.

فیلم اموزشی اینسپکت المنت  برای این هست تا با هم یاد بگیریم که به عنوان یک برنامه نویس Front-end و یا حتی Back-end چطور به درستی از اینسپکت المنت استفاده کنیم. همچنین یک سری ترفند برای کاربرانی که از وب استفاده میکنند در نظر گرفتیم.

این جلسه شامل موارد زیر است :

  • بررسی Content editable با استفاده از اسکریپت document.body.contentEditable = true
  • تغییر قیمت محصول در دیجیکالا
  • افزایش تعداد فالور در اینستاگرام
  • دور زدن پاپ آپ های تبلیغاتی
  • دانلود تصاویر و ویدیوها از اینستاگرام
  • تغییر type مقادیر ورودی رمزعبور و نمایش رمزعبورها
  • تیک آبی اینستاگرام
۱۴ نظر
  • Agahi90.iR
    ارسال در : ۲۰:۴۵h, ۰۸ بهمن پاسخ
    (5/5)

    سلام چطوری بفهمیم مثلا لوگوی یک سایت ساختار html اش در کدام فایل و در کدام مسیر هست ؟

    • حسین بدرنژاد
      ارسال در : ۰۷:۰۴h, ۱۶ بهمن پاسخ

      سلام و عرض ادب.
      امیدواریم که حالتون خوب و پر از انرژی مثبت باشید.
      روش دیگری علاوه بر تب المنت برای پیدا کردن تصاویر و فایل ها وجود دارد، آن هم استفاده از تب نتورک در اینسپکت المنت است.
      برای این کار ابتدا این کار ابتدا اینسپکت را بزا کرده و به تب نتورک اینسپکت المنت بروید. بعد از این کار کافی است تا صفحه را رفرش کنید و تمام اطلاعات رد و بدل شده را میتوانید مشاهده کنید و به دنبال تصویر مورد نظر خود بگردید. روی آن کلیک کنید و open in new tab یا save را بزنید.
      موفق باشید.
      با تقدیم احترام، حسین بدرنژاد.

  • Agahi90.iR
    ارسال در : ۱۲:۰۷h, ۱۰ بهمن پاسخ
    (5/5)

    سلام
    فرض کنید ما بخواهیم بفهمیم که مثلا لوگوی یک سایت در کدام فایل در اون سایت قرار گرفته
    وقتی بروی اون لوگو inspect رو میزنیم و کدها و سی اس اس هاشون میبینیم از کجا بفهمیم که اون عکس در کدام فایل در هاست قرار داره؟
    مسیر فایل رو از کجا پیدا کنیم ؟ مسیر ذخیره سازی عکس رو نمیگم مسیر فایلی که اون کدهای تصویر در اون فایل قرار دارند رو میگم
    ممنون

    • حسین بدرنژاد
      ارسال در : ۰۶:۵۹h, ۱۶ بهمن پاسخ

      سلام و عرض ادب.
      امیدواریم که حالتون خوب و پر از انرژی مثبت باشید.
      به طور کلی تصاویر به دو صورت میتوانند نمایش داده شوند. حالت اول به این صورت است که آدرس تصویر داخل مشخصه ی src در تگ img قرار دارد. در این حالت کافی است تا با کلیک راست روی تصویر و انتخاب گزینه اینسپکت المنت کد آن را ببینید و دنبال آدرس src بگردید و به طور مثال روی آن کلیک راست کنید و open in new tab را بزنید تا هم آدرس کلی تصویر را ببینید هم بتوانید آن را ذخیره کنید.
      حالت دوم این است که تصویر را بصورت استایل background : url در css قرار میدهند که در این حالت باز هم باید روی تصویر کلیک راست کنید و گزینه inspect element را بزنید و اینبار در استایل های آن به دنبال background بگردید و بعد از پیدا کردن آن open in new tab بزنید.
      موفق و پیروز باشید.
      با تقدیم احترام، حسین بدرنژاد.

  • me
    ارسال در : ۱۷:۰۷h, ۰۴ مهر پاسخ
    (5/5)

    دوره مفید و جامعی بود خداقوت

    • هولوسن
      ارسال در : ۱۰:۲۹h, ۰۵ مهر پاسخ

      جناب سلطانی عزیز سلام و عرض ادب

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

      با تقدیم احترام، پشتیبانی هولوسن

  • میلاد نوری
    ارسال در : ۲۱:۱۵h, ۰۶ آبان پاسخ
    (5/5)

    دوره خیلی خوبی بود مرسی واقعا

    • هولوسن
      ارسال در : ۱۴:۲۲h, ۱۰ آبان پاسخ

      جناب آقای نورى عزیز و گرانقدر

      از ابراز لطف شما بسیار سپاسگزاریم. خوشحالیم که این دوره مورد توجه شما قرار گرفته است…
      از سخاوتتان در ارسال این کامنت قدردانى می کنیم و امیدواریم همراهی و حضور سبزتان را همچنان در هولوسن داشته باشیم…🌹

      سربلند و مانا باشید…

  • صابر محمودی
    ارسال در : ۱۸:۳۱h, ۲۱ آذر پاسخ
    (4/5)

    با سلام خدمت ٱقای بدرنژاد.در یک سایت بازی میشه در قسمت elements نتیجه و تنظیمات بازی رو به نفع خود تغییر داد?بازی به صورتیه که یه تاس میندازیم یا بالای ۵۰ میاد یا کمتر اگر حدسمون درست باشه قبل تاس بردیم.عین شیر یا خطه خودمون.منظور میشه یه گزینه رو غیر فعال کرد که همیشه یکیش بیاد.یا همچین چیزی امکان پذیر نیست?هر چند سوالم شاید مبتدی باشه.با سپاس

    • هولوسن
      ارسال در : ۱۲:۲۱h, ۲۲ آذر پاسخ

      صابر محمودی عزیز سلام و عرض ادب
      امیدوار هستیم که خوب، سرحال و سرشار از حس مثبت باشید.

      اگه اون بخشی که شما می‌فرمایید “فقط” سمت جاوااسکریپت هندل شده باشه بله میتوان تغییر داد.
      ولی اگه شما تاس بندازی، تاس بره سمت سرور برای شما یه عدد بین ۱ تا ۶ رو میسازه و برمیگردونه، نمی‌توان تغییر داد.
      اگه تو همین مثال، عدد تاس سمت جاوا اسکریپت ساخته بشه شما توانایی داری که یه کاری کنی که همیشه ۶ بیاد….
      با تقدیم احترام، پشتیبانی هولوسن

  • شیده
    ارسال در : ۰۱:۳۹h, ۱۷ فروردین پاسخ
    (4/5)

    باسلام، دورتون رو کامل دیدم و مفید بود برام. خیلی ممنون بابت وقتی که گذاشتید. عمرتون پربرکت،
    برقرار باشید بزرگوار

    • هولوسن
      ارسال در : ۱۷:۰۷h, ۳۰ فروردین پاسخ

      شیده عزیز سلام و عرض ادب
      امیدوار هستیم که حال دل شما عالی و سرشار از حس مثبت باشید

      حس مثبت موجود در کلام شما به صورت کامل قابل درک می باشد. ممنون از انرژی و حس مثبت کلام شما. از صمیم قلب خوشحال هستیم که توانسته ایم رضایت خاظر مخاطبان خود را فراهم کنیم.از صمیم قلب به داشتن مخاطبانی چون شما افتخار میکنیم.

      با تقدیم احترام، هولوسن

  • امیر 1234
    ارسال در : ۱۹:۴۴h, ۱۷ فروردین پاسخ
    (5/5)

    سلام عالی بود استاد فقط لطفا بگید چطور ذخیره کنیم اون تغییرات رو

    • هولوسن
      ارسال در : ۱۷:۰۵h, ۳۰ فروردین پاسخ

      امیر عزیز سلام و عرض ادب
      امیدوار هستیم که حالتون عالی و سرشار از حس مثبت باشید.

      ذات اینسپکت المنت بدین صورت است که شما قادر به ذخیره سازی آنچه که از سمت سرور ارسال میگردد، نمی باشید. از اینسپکت میتوانید استفاده کنید تا نمود ظاهری تغییرات خود را مشاهده کنید و در صورتی که سایت متعلق به شماست از تغییرات استفاده بفرمایید در غیر این صورت اگر به دنبال تغییر کدهای سایتی که بدان دسترسی ندارید می باشید، با اینسپکت المنت به صورت روتین قادر نخواهید بود.(اگر میخواهید تغییراتی روی سایت خود اعمال کنید کامل در دوره آموزش داده شده است).
      با تقدیم احترام، پشتیبانی هولوسن

**پرسش و پاسخ** سوال خود مطرح کنید.
امتیاز شما*