اذهب إلى المحتوى
  • 0

JS - Dom - جلب عناصر من صفحة HTML و تخزين مرجعية لهم في مصفوفة

Shahad Mohammad

السؤال

لدي في الhtml  ديف تشمل مجموعه صور ، لا اعلم اذا كان اسم متعارف عليه بالبرمجة او لا فانا جديدة في الجافا سكربت لكن فهمت انه اسمه duck وبداخله عدة عناصر ، كيف اضع عناصر الدك في مصفوفه؟ 

 

  <section id="deck" class="d-flex flex-wrap gap-3 justify-content-center align-items-center">

        <li class="card">

          <i class="fab fa-python"></i>

        </li>

        <li class="card">

          <i class="fab fa-js-square"></i>

        </li>

        <li class="card">

          <i class="fab fa-python"></i>

        </li>

        <li class="card">

          <i class="fas fa-code"></i>

        </li>

        <li class="card">

          <i class="fab fa-react"></i>

        </li>

        <li class="card">

          <i class="fab fa-js-square"></i>

        </li>

      </section>

 

تم التعديل في بواسطة Wael Aljamal
توضيح السؤال
رابط هذا التعليق
شارك على الشبكات الإجتماعية

Recommended Posts

  • 0

لقراءة و تخزين أكثر من عنصر نحتاج لعمل استعلام من خلال document.querySelectorAll فهي تعيد مصفوفة و نمرر لها محدد الوصول المناسب وهنا لدينا deck# li لجلب كل عناصر list item من ضمن div.

elements = document.querySelectorAll('#deck li');

 

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0

بالإضافة إلى إجابة وائل, فإن الدالة querySelectorAll تُعيد نوعًا خاص من القوائم شبيه بالمصفوفة(array) يُدعى NodeList , ذلك النوع مُشابه لل array ولكن يوجد عدة فروق بينهما أهمها أن NodeList لا يمتلك أغلب دوال array المشهورة مثل push, pop, slice, join 

لتحويل NodeList إلى array يمكنك إستخدام الدالة Array.from كما في المثال التالي 

elements = document.querySelectorAll('#deck li');
const elements_arr = Array.from(elements);

 

رابط هذا التعليق
شارك على الشبكات الإجتماعية

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...