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

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



  آیا می دانید میانگین رضایت دانشجویان سون لرن از دوره ها، بیش از 94% می باشد!

ترفندهای پیشرفته jQuery (قسمت 22)

2 775 ۲۶ مهر ۹۴

در این قسمت با ادامه ترفندهای پیشرفته jQuery در خدمت شما هستیم.
jquery trickshot

موضوع چهارم : Ajax

ترفند 43 : دسترسی به اطلاعات سایت با YQL

YQL یک API کامل برای توسعه دهندگان Javascript هست. با استفاده از قدرت اون میشه در محیطی شبیه به SQL-Lite با API های دیگه کار کرد. در اینجا میخایم دسترسی به اطلاعات HTML سایت دیگری رو بهتون آموزش بدیم. فرض کنیم میخایم اطلاعات خاصی از سایت فارسیال رو بیرون بکشیم. اگر به این سایت برید صفحه ای همانند تصویر زیر رو میبینید:

farsial.com

فرض کنید میخاید این 5 مورد رو از این صفحه بیرون بکشید. برای اینکار اول روی این موارد Inspect Element میکنیم تا بفهمیم که class و ... اونا چی هست.farsial.com2

همونطور که دیدید همشون در div با کلاس index_facilities قرار دارن. پس برای دسترسی به اونا توسط YQL به شکل زیر عمل میکنیم:

ابتدا متغیر اول رو تعریف میکنیم:

اگر با SQL آشنا باشید دستور بالا رو متوجه خواهید شد. میبینید که گفتیم به url مربوطه برو و چیزایی که درون المنتهای مورد نظر هست رو انتخاب کن. حالا برای اینکه از YQL استفاده کنیم ، باید متغیر بالا رو بصورت زیر بهش پاس بدیم:

حالا از قدرت jQuery و تابع $.getJSON بهره میبریم:

میبیند که متغیر دوم رو به این تابع پاس دادیم و با اینکار نتایج انتخابی در متغیر r ذخیره میشن. حالا میتونین اطلاعات خاصی رو ازش بیرون بکشیم. همونطور که دیدیم از تابع each هم استفاده کردیم و محتوای هر li رو در console چاپ کردیم. خروجی بصورت زیر خواهد بود:

از قدرت YQL میتونین در زمینه های دیگه ای هم استفاده کنید و خودتون میتونین در این زمینه جستجوهای بیشتری انجام بدین.

ترفند 44 : استفاده از متدهای سراسری Ajax

شما میتونین روش انجام درخواست های Ajax توسط برنامتون رو ساده سازی و مدیریت کنید و خودتون رو از شر نوشتن کدهای اضافه خلاص کنید. این کار رو میتونین با استفاده از متدهای سراسری Ajax انجام بدین:

برای مثال میایم یک div میسازیم که درون اون یک لودر قرار داده بشه که نشون بده درخواست Ajax داره اجرا میشه و اونو به body اضافه میکنیم:

بعد از اون هم میخایم کاری کنیم که هر زمانی که یک درخواست Ajax فراخوانی میشه ، لودر نمایش داده بشه:

هر وقت یک درخواست Ajax فرستاده میشه متد ajaxStart فراخوانی میشه و لودر مورد نظر نمایش داده میشه. حالا برای اینکه کاری کنیم وقتی که Ajax به پایان رسید لودر مخفی بشه ، میتونین بصورت زیر عمل کنید:

حالا مثلا برای اینکه این مورد رو تست کنیم ، کد Ajax زیر رو قرار میدیم:

با اینکار بصورت اتوماتیک از زمان آغاز تا 0.8 ثانیه بعد از پایان درخواست Ajax لودر نمایش داده میشه.

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

موفق و پیروز باشید

یا علی

Source

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

دیدگاه ها 2 دیدگاه برای این مطلب ارسال شده است.

  • ‏‏
    user 2014(۲۸ مهر ۱۳۹۴)

    سلام من کد اولی yql رو توی یه صفحه html بین دوتا تگ script گذاشتم ولی کار نمیکنه

  • ارسال دیدگاه

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

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

    ورود به سایت

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

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

    عبارت :
    7LearnTelegram