انتقل إلى محتوى الدرس

JavaScript nextSibling get next Object قراءة الكائن التالي بواسطة دالة nextSibling في جافا سكريبت

سوف تتعلم في هذا الدرس وظيفة دالة nextSibling وكيفية استخدامها وكيفية التنقل إلي العنصر التالي المُتفرع من نفس الأب داخل شجرة DOM في لغة جافا سكريبت.

1 صفوف تعليمية
جافا سكريبت
2,585 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

nextSibling تقوم بقراءة أي كائن بجوار العنصر التالي سواء كان عنصر أو إذا كانت مسافة فارغة هناك فرق بين المثالين التاليين.

JavaScript nextSibling with space

سيتم إرجاء المسافة بين عنصر h1 وعنصر p لأن nextSibling تقوم بإرجاع الكائن المجاور وليس العنصر والكائن المجاور هو المسافة.

HTML
<h1 id="h1">JavaScript nextSibling </h1>
<p>from CloseTag nextSibling </p>
<script>
  let h1 = document.getElementById('h1')
  /* check console */
  console.log(h1.nextSibling)
</script>

JavaScript nextSibling with next element

سيتم إرجاء المسافة العنصر الذي يلي عنصر h1 وهو عنصر p لأن nextSibling تقوم بإرجاع الكائن المجاور.

HTML
<h1 id="h1">JavaScript nextSibling </h1><p>from CloseTag nextSibling </p>
<script>
  let h1 = document.getElementById('h1')
  /* check console */
  console.log(h1.nextSibling)
</script>

JavaScript get nextSibling content

قراءة وإرجاع المحتوي الداخلي للعنصر المجاور في لغة جافا سكريبت.

HTML
<h1 id="h1">JavaScript nextSibling </h1><p>from CloseTag nextSibling </p>
<script>
  let h1 = document.getElementById('h1')
  /* check console */
  console.log(h1.nextSibling.innerText)
</script>