عرض مصدر JavaScript/Document/elementFromPoint

<noinclude>{{DISPLAYTITLE:<code>Document.elementFromPoint()‎</code>}}</noinclude>
'''تنبيه:''' هذه تقنيّة تجريبيّة، انظر جدول دعم المتصفّحات قبل استخدام هذا التّابع في شيفرة إنتاجيّة.

يعيد التّابع <code>Document.elementFromPoint‎()‎</code> العنصر الموجود في أعلى الإحداثيّات المعطاة (حسب إطار العرض (viewport)).

إن كان العنصر في النّقطة المحدّدة خاصًّا بمستند آخر (مثل مستند فرعيّ لعنصر iframe مثلًا)، فالعنصر الأب للمستند الفرعيّ هو الذي يُعاد (أي عنصر iframe نفسه). إن كان العنصر في النّقطة المُعطاة مجهولًا (anonymous) أو محتوًى مولَّدًا عبر XBL، مثل شريط التمرير (scroll bar) في صندوقٍ نصيّ، فأول عنصرٍ أبٍ غير مجهولٍ هو الذي يُعاد (الصّندوق النّصيّ مثلًا).

إن كانت النّقطة المعطاة خارج حدود المستند الظّاهرة أو أحد الإحداثيّات سلبيًّا، فالنّتيجة ستكون القيمة <code>null</code>.

إن أردت أن تجد الموقع المحدّد بالضّبط داخل العنصر، فاستخدم التّابع <code>Document.caretPositionFromPoint()‎</code>.

==البنية العامة==
<syntaxhighlight lang="javascript">
var element = document.elementFromPoint(x, y);
</syntaxhighlight>

===المعاملات===
====<code>x</code>====
الإحداثيّ الأفقيّ لنقطة ما.

====<code>y</code>====
الإحداثيّ العمودي لنقطة ما.

===القيمة المعادة===
كائن من النّوع <code>Element</code> يمثّل أعلى عنصر تحت النّقطتين المعطيين.

==مثال==
<syntaxhighlight lang="javascript">
<!DOCTYPE html>
<html lang="en">
<head>
<title>elementFromPoint مثال</title>

<script>
function changeColor(newColor) {
  elem = document.elementFromPoint(2, 2);
  elem.style.color = newColor;
}
</script>
</head>

<body>
<p id="para1">محتوى نصيّ</p>
<button onclick="changeColor('blue');">أزرق</button>
<button onclick="changeColor('red');">أحمر</button>
</body>
</html>
</syntaxhighlight>

==دعم المتصفّحات==
{| class="wikitable"
!الميزة
!|Chrome
!Firefox
!Internet Explorer
!Opera
!Safari
|-
! الدعم الأساسي
|53
|نعم
|نعم
|40
|نعم
|-
|}

==مصادر ومواصفات==
* مواصفة [https://w3c.github.io/webcomponents/spec/shadow/#extensions-to-the-documentorshadowroot-mixin Shadow DOM]

[[تصنيف:JavaScript]]
 [[تصنيف:Web API]]
 [[تصنيف:DOM]]
 [[تصنيف:Document]]