آموزش جی‌کوئری(jQuery)[قسمت 5]

دسته بندی ها : آموزش, آموزش جاوا اسکریپت, برنامه‌نویسی 31 فروردین 1399 امیرمحمد جوشقانی 406 بازدید
آموزش جی‌کوئری

داخل این قسمت از جی کوئری، اول کارکردن با css رو تموم میکنیم و بعدش میریم تا یخرده با قوانین والد-فرزندی داخل jQuery آشنا بشیم.

ابعاد عناصر در جی کوئری

متدهای موجود در این بخش:

عرضwidth
ارتفاعheight
عرض عنصر (همراه padding)innerWidth
ارتفاع عنصر (همراه padding)innerHeight
عرض عنصر همراه (همراه padding و border)outerWidth
ارتفاع عنصر (همراه padding و border)outerHeight
ابعاد

کمی توضیح بیشتر: outerWidth و outerHeight، یک پارامتر بولین میگیرن که بطور پیشفرض false هست. اگر پارامتر را true قرار بدید، مقدار margin هم حساب میشه

خصوصیات والد-فرزندی در jQuery

همتون میدونید که توی کد زیر، li فرزند ul هست. یعنی چی؟ یعنی اینکه اول تگ ul قرار داشته و بعد ul. یعنی ul والد li حساب میشه. (اگه نفهمیدید، یه بار دیگه بخونین 😀 )

خب، توی جی کوئری یسری متد هست، که به کمک اونا میشه این نوع اطلاعات عناصر رو بدست آورد.

والدها

برای بدست آوردن عناصر والد در جی کوئری یک عنصر، متدهای زیر رو داریم:

اولین والدparent
تمامی والدهاparents
تمامی عناصر ELEMENT که در برگیرنده عنصر انتخاب شده هستند(“ELEMENT”)parentsUntil
والدها

فرزندان

این بخش از جی کوئری، شمال متدهای زیر میشه:

تمامی فرزندان عنصر انتخاب شدهchildren
تمامی عناصر ELEMENT که فرزندان عنصر انتخاب شده هستند.(“ELEMENT”)find
فرزندان

خواهر و برادران

عناصر خواهر و برادر داخل یک عنصر پدر، با متدهای جی کوئری زیر کنترل میشوند:

تمامی عناصرهای خواهرsiblings
عنصر خواهر بعدیnext
تمامی عناصر خواهر بعدیnextAll
تمامی عناصر بین عنصر انتخاب شده و عنصر E(“E”)nextUntil
عنصر خواهر قبلیprev
تمامی عناصر خواهر قبلیprevAll
تمامی عناصر بین عنصر انتخاب شده و عنصر E(“E”)prevUntil
خواهر و برادری

کمی توضیج بیشتر: siblings یک پارامتر به عنوان string میگیره که الزامی نیست و اگه مثلا element رو به عنوان پارامتر بهش بدید، تمامی عناصر element خواهر رو انتخاب میکنه. مثال:

اینم از آموزش این قسمت!

اگه قسمت قبلو ندیدید، اینجاست!

بنابراین تا قسمت بعدی از آموزش جی‌کوئری، با iranianPG همراه باشید! (#ویکی‌پدیا_طور 😀 )

امیرمحمد جوشقانی
امیرمحمد جوشقانی

راه آسان‌تری برای ارتباط با کاربران‌مان پیدا کرده‌ایم :) عضویت در کانال

مطالب زیر را حتما بخوانید:

نظرات کاربران

    دیدگاهتان را بنویسید

    نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

    لینک کوتاه :

    عضویت در خبرنامه ویژه مشتریان سیگما پلاس

    با عضویت در خبرنامه ویژه سیگما پلاس از آخرین جشنواره های سایت باخبر شوید!