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



  • ۲۶
  • آبان

جلسه ۲۳ : عناصر فرزند تکنیک Traversing در jQuery

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

      مقدمه

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

      تا این بخش از آموزش این فصل ، برای آشنایی شما با تعاریف و مفاهیم تکنیک Traversing ، بخش کاربردی مقدمه ای بر تکنیک Traversing در jQuery و برای آشنایی با عناصر والد (ancestor) ، بخش عناصر والد در تکنیک Traversing در jQuery ، را ارئه کردیم.

      در ادامه ی بخش، به موضوع عناصر فرزند یا descendant تکنیک Traversing در jQuery ، می پردازیم.

       

      عناصر فرزند یا descendant تکنیک Traversing در jQuery

      عناصر فرزند یا descendant تکنیک Traversing در jQuery

       

      عناصر فرزند یا descendant تکنیک Traversing در jQuery

      یک عنصر descendant ، در واقع عناصر فرزند،نوه و …را تا پایین ترین سطح درخت DOM، را شامل می شود.

      در jQuery ، می توانید به تمام عناصر فرزند یک عنصر در درخت DOM ، دسترسی پیدا کنید.

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

      برای پیمایش پایین درخت DOM ، و برگرداندن عناصر فرزند ، دو تابع ارائه شده است:

      • ()children
      • ()find

      تابع ()children

      تابع ()children ، تمام فرزندان مستقیم عنصر انتخاب شده را ، برمی گرداند.

      این روش فقط یک سطح از درخت DOM ، را پیشمایش می کند.

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

      مثال : 

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

      در مثال زیر ، تمام عناصر فرزند مستقیم عنصر <div> ، که عنصر <p> ، با نام کلاس “first” ، هستند را، بر می گرداند:

      مثال : 

      تابع ()find

      از تابع ()find ، برای برگرداندن تمام عناصر فرزند ، عنصر انتخاب شده استفاده می شود.

      این تابع تا پایین سطح درخت DOM، را پیمایش می کند.

      مثال زیر تمام عناصر <span> ، که فرزندان عنصر <div> ، هستند را برمی گرداند.

      مثال : 

      مثال ۲: برگرداندن تمام عناصر فرزند ، عنصر <div> :

      مثال : 

      کلام آخر

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

      QR:  جلسه ۲۳ : عناصر فرزند تکنیک Traversing در jQuery
      به اشتراک بگذارید