في هذا الدرس 3تصفّح المواضيع
JavaScript nextElementSibling Method
دالة nextElementSibling في لغة جافا سكريبت
JavaScript nextElementSibling Method دالة nextElementSibling في لغة جافا سكريبت
تستخدم دالة nextElementSibling في لغة جافا سكريبت لقراءة وإرجاع العنصر التالي المُتفرع من نفس الأب داخل شجرة DOM tree بخلاف دالة nextSibling فأنها تقوم بقراءة وارجاع الكائن التالي وليس العنصر التالي.
وظيفة nextElementSibling في لغة جافا سكريبت:
قراءة العنصر التالي المُتفرع من نفس الأب داخل شجرة DOM tree.
قيم nextElementSibling في لغة جافا سكريبت:
- قراءة العنصر التالي العنصر المُتفرع من نفس الأب داخل شجرة DOM tree.
- null ارجاع قيمة في حال عدم وجود عنصر مجاور تالي مُتفرع من العنصر الأب داخل شجرة DOM tree.
JavaScript nextElementSibling syntax
طريقة كتابة دالة nextElementSibling في لغة جافا سكريبت.
element.nextElementSibling
JavaScript nextElementSibling
دالة nextElementSibling في لغة جافا سكريبت
JavaScript nextElementSibling دالة nextElementSibling في لغة جافا سكريبت
JavaScript nextElementSibling
قراءة وإرجاع الكائن التالي داخل شجرة DOM في لغة جافا سكريبت عن طريق دالة nextElementSibling.
<!DOCTYPE html>
<html>
<head>
<title>JavaScript nextElementSibling</title>
</head>
<body>
<h1 id="h1">JavaScript nextElementSibling</h1>
<p id="paragraph">from CloseTag nextElementSibling</p>
<script>
let h1 = document.getElementById('h1')
/* check console */
console.log(h1.nextElementSibling)
</script>
</body>
</html>
Result from console
JavaScript nextElementSibling VS nextSibling
الفرق بين دالة nextElementSibling ودالة nextSibling في جافا سكريبت
JavaScript nextElementSibling VS nextSibling الفرق بين دالة nextElementSibling ودالة nextSibling في جافا سكريبت
دالة nextSibling تقوم بقراءة وإرجاع أي كائن تالي مجاور سواء كان عنصر أو كانت مسافة فارغة بينما دالة nextElementSibling تقوم بقراءة وإرجاع أي عنصر تالي مجاور فقط وتتجاهل المسافات في لغة جافا سكريبت.
JavaScript nextElementSibling
قراءة وإرجاع الكائن التالي داخل شجرة DOM في لغة جافا سكريبت عن طريق دالة nextElementSibling.
<!DOCTYPE html>
<html>
<head>
<title>JavaScript nextElementSibling</title>
</head>
<body>
<h1 id="h1">JavaScript nextElementSibling</h1>
<p id="paragraph">from CloseTag nextElementSibling</p>
<script>
let h1 = document.getElementById('h1')
/* check console */
console.log(h1.nextElementSibling)
</script>
</body>
</html>JavaScript nextSibling with space
سيتم إرجاء المسافة بين عنصر h1 وعنصر p لأن nextSibling تقوم بإرجاع الكائن المجاور وليس العنصر والكائن المجاور هو المسافة.
<!DOCTYPE html>
<html>
<head>
<title>JavaScript nextSibling </title>
</head>
<body>
<h1 id="h1">JavaScript nextSibling </h1>
<p>from CloseTag nextSibling </p>
<script>
let h1 = document.getElementById('h1')
/* check console */
console.log(h1.nextSibling)
</script>
</body>
</html>سجّل الدخول لحفظ تقدمك
تابع إنجاز المواضيع والمصطلحات والمهام، وكمّل من آخر خطوة على أي جهاز.