دوره های آموزشی آکادمی پی وی لرن (پروژه محور و ویژه بازار کار)



  • ۲۶
  • آبان

جلسه ۲۴ : عناصر خواهر و برادر در Traversing در jQuery

  • دسته‌بندی‌ها :
جلسه ۲۴ : عناصر خواهر و برادر در Traversing در jQuery
    • جزئیات
    • نوع محتواآموزش تصویری

      مقدمه

      با عرض سلام و وقت بخیر خدمت کاربران سایت پی وی لرن . و کاربرانی که دوره کامل آموزش jQuery ، را دنبال می کنند. در بخش های قبلی تاکنون ، وارد مبحث پیمایش درخت DOM در تکنیک Traversing، شدیم. و به برخی از توابع آن نیز ، اشاره کردیم. اکنون در ادامه آن مباحث، در این بخش قصد داریم به مبحث عناصر خواهر و برادر در Traversing در jQuery ، بپردازیم.

      همانطور که اشاره کردیم. بعد از ارائه مفاهیم اولیه تکنیک Traversing ، در ادامه به پیمایش درخت DOM، پرداخته ایم. و چگونگی بدست آوردن عناصر والد و پیمایش پایین درخت برای بدست آوردن عناصر فرزند، را بررسی کردیم.

      اکنون در ادامه ی مباحث فصل، به موضوع عناصر خواهر و برادر یا siblings در Traversing در jQuery ، می پردازیم.

       

      عناصر خواهر و برادر یا siblings در Traversing در jQuery

      عناصر خواهر و برادر یا siblings در Traversing در jQuery

       

      عناصر خواهر و برادر یا siblings در Traversing در jQuery

      در jQuery ، می توانید در سطحی که عنصری انتخاب شده است. پیمایش کرده و عناصر خواهر و برادر عنصر انتخاب شده را برگردانید.

      این روش پیدا کردن عناصر خواهر و برادر یک عنصر ، Siblings نام دارد.

      روشهای پیمایش در سطح جاری درخت DOM

      عناصر خواهر و برادر یا siblings در Traversing در jQuery

      عناصر خواهر و برادر یا siblings در Traversing در jQuery

       

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

      • ()siblings
      • ()next
      • ()nextAll
      • ()nextUntil
      • ()prev
      • ()prevAll
      • ()prevUntil

      تابع ()siblings

      تابع ()siblings ، تمام عناصر خواهر و برادر عنصر انتخاب شده را برمی گرداند.

      مثال زیر ، چگونگی پیدا کردن عناصر خواهر و برادر عنصر <h2> ، را به خوبی نشان می دهد:

      مثال : 

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

      در مثال زیر ، تمام عناصر خواهر و برادر عنصر <h2> ،که شامل عنصر <p> ، می شود. برگردانده می شود:

      مثال : 

      تابع ()next

      از تابع ()next ، برای پیدا کردن اولین عنصر خواهر و برادر ، عنصر انتخاب شده، استفاده می شود.

      مثال زیر ، چگونگی برگرداندن اولین عنصر خواهر و برادر عنصر <h2> ، را بخوبی نشان می دهد:

      مثال : 

      تابع ()nextAll

      تابع ()nextAll ، تمام عناصر خواهر برادر عنصر انتخاب شده، که بعد از آن قرار  دارند، را برمی گرداند.

      این مثال چگونگی برگرداندن تمام عناصر خواهر و برادر عنصر <h2>، که بعد از آن عنصر، قرار دارند را ، بخوبی نشان می دهد:

      مثال : 

      تابع()nextUntil

      تابع ()nextUntil ،تمام عناصر خواهر برادر عنصر انتخاب شده را، که بین دو عنصر مشخص شده قرار دارند، برمی گرداند.

      مثال زیر چگونگی برگرداندن عناصر خواهر و برادر عنصر انتخاب شده که، بین دو عنصر <h2> و <h6> ، قرار دارند را نشان می دهد:

      مثال : 

      سایر توابع این بخش

      توابع ()prev() ، prevAll و ()prevUntil ، بسیار شبیه به سایر توابعی که در این بخش به آن اشاره شده ، عمل می کنند. تنها تفاوت این توابع در این است که، توابع قبلی عناصر خواهر و برادری که بعد از عنصر جاری، قرار داشتند را بر می گرداند. اما این توابع برعکس آنها عمل می کنند. یعنی عناصر خواهر و برادری که قبل از عنصر جاری، قرار دارند، را بر می گرداند.

      کلام آخر

      تا این بخش از آموزشهای این فصل، چگونگی پیمایش در طول درخت DOM ، و پیدا کردن عناصر والد و فرزند را ارائه کردیم. در تکمیل همین مباحث ، در این بخش نیز، روشهای برگرداندن عناصر خواهر و برادر عنصر انتخاب شده را ، در قالب موضوع عناصر خواهر و برادر یا siblings در Traversing در jQuery ، ارائه کردیم.

       

      QR:  جلسه ۲۴ : عناصر خواهر و برادر در Traversing در jQuery
      به اشتراک بگذارید