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

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



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

ممکنه شما نیاز به jQuery نداشته باشید (قسمت 7)

0 298 ۲۴ دی ۹۴

در این مطلب با ادامه مطالب مربوط با کدهای جایگزین برای jQuery در خدمتتون هستم و امیدوارم که بدردتون بخوره.
Javascript-vs-jquery

موضوع 3 : المنتها و کار با DOM

مورد 9 : empty کردن المنتها

اگر بخوایم در jQuery یک el رو empty یا خالی کنیم، بصورت زیر عمل میکنیم:

میبینید که با استفاده از متد empty المنت el رو خالی کردیم و اعضای اون پاک میشن.

حالا همین کار رو اگر بخواید با Javascript خالص انجام بدین بصورت زیر خواهد بود:

برای IE8 به بالا:

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

برای IE9 به بالا:

برای IE9 به بالا میتونین براحتی کد بالا رو قرار بدین. این کد میاد و هر چی که درون el هست رو برمیداره و جاش هیچی رو قرار میده.

مورد 10 : فیلتر کردن خروجی

اگر بخوایم در jQuery یک فیلتر قرار بدیم، بصورت زیر عمل میکنیم:

میبینید که در ابتدا المنتهایی رو انتخاب میکنیم و بعد از اون با استفاده از متد filter ، تابع filterFn رو بعنوان فیلتر کننده مشخص میکنیم. وقتی تابعی رو قرار میدیم، به ازای هر المنت انتخاب شده یکبار این تابع اجرا میشه و اگه true بده المنت خواهد ماند، ولی اگر false برگشت داده بشه، المنت فیلتر میشه و حذف میشه.

حالا همین کار رو اگر بخواید با Javascript خالص انجام بدین بصورت زیر خواهد بود:

برای IE8 به بالا:

همون ایده بالا منتها با استفاده از کدنویسی Javascript خالص اجرا شده. در بالا یک تابع بنام filter ساخته شده و دو ورودی selector و filterFn هم وارد میشن و کار فیلتر کردن انجام میشه.

برای IE9 به بالا:

برای IE9 به بالا میتونین براحتی کد بالا رو قرار بدین. این کد نمونه پیشرفته تر و بهینه تری نسبت به کد قبل هست و در IE8 پشتیبانی نمیشه.

مورد 11 : پیدا کردن فرزندان

اگر بخوایم در jQuery فرزندان یک المنت رو پیدا و انتخاب کنیم، بصورت زیر عمل میکنیم:

میبینید که با استفاده از متد find در المنت el جستجو کردیم و المنتهایی که با selector مطابقت دارند رو انتخاب کردیم.

حالا همین کار رو اگر بخواید با Javascript خالص انجام بدین بصورت زیر خواهد بود:

برای IE8 به بالا:

کد بالا دقیقا همون کاربرد مورد نظر رو داره و میتونین از اون استفاده کنید.

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

موفق و سربلند باشید.

یا علی

Source

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

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

ارسال دیدگاه

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

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

ورود به سایت

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

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

عبارت :
7LearnTelegram