الفرق بين المراجعتين لصفحة: «JavaScript/Document/elementFromPoint»
ط روابط |
طلا ملخص تعديل |
||
| سطر 2: | سطر 2: | ||
'''تنبيه:''' هذه تقنيّة تجريبيّة، انظر جدول دعم المتصفّحات قبل استخدام هذا التّابع في شيفرة إنتاجيّة. | '''تنبيه:''' هذه تقنيّة تجريبيّة، انظر جدول دعم المتصفّحات قبل استخدام هذا التّابع في شيفرة إنتاجيّة. | ||
يعيد التّابع <code>Document.elementFromPoint()</code> العنصر الموجود في أعلى الإحداثيّات المعطاة (حسب إطار العرض | يعيد التّابع <code>Document.elementFromPoint()</code> العنصر الموجود في أعلى الإحداثيّات المعطاة (حسب إطار العرض [viewport]). | ||
إن كان العنصر في النّقطة المحدّدة خاصًّا بمستند آخر (مثل مستند فرعيّ لعنصر iframe مثلًا)، فالعنصر الأب للمستند الفرعيّ هو الذي يُعاد (أي عنصر iframe نفسه). إن كان العنصر في النّقطة المُعطاة مجهولًا (anonymous) أو محتوًى مولَّدًا عبر XBL، مثل شريط التمرير (scroll bar) في صندوقٍ نصيّ، فأول عنصرٍ أبٍ غير مجهولٍ هو الذي يُعاد (الصّندوق النّصيّ مثلًا). | إن كان العنصر في النّقطة المحدّدة خاصًّا بمستند آخر (مثل مستند فرعيّ لعنصر iframe مثلًا)، فالعنصر الأب للمستند الفرعيّ هو الذي يُعاد (أي عنصر iframe نفسه). إن كان العنصر في النّقطة المُعطاة مجهولًا (anonymous) أو محتوًى مولَّدًا عبر XBL، مثل شريط التمرير (scroll bar) في صندوقٍ نصيّ، فأول عنصرٍ أبٍ غير مجهولٍ هو الذي يُعاد (الصّندوق النّصيّ مثلًا). | ||
| سطر 15: | سطر 15: | ||
</syntaxhighlight> | </syntaxhighlight> | ||
===<code>x</code>=== | |||
الإحداثيّات الأفقيّة لنقطة ما. | |||
===<code>y</code>=== | |||
الإحداثيّات الرأسية لنقطة ما. | |||
===القيمة المعادة=== | ===القيمة المعادة=== | ||
| سطر 26: | سطر 25: | ||
==مثال== | ==مثال== | ||
<syntaxhighlight lang=" | <syntaxhighlight lang="html"> | ||
<!DOCTYPE html> | <!DOCTYPE html> | ||
<html lang="en"> | <html lang="en"> | ||
المراجعة الحالية بتاريخ 01:59، 2 أبريل 2018
تنبيه: هذه تقنيّة تجريبيّة، انظر جدول دعم المتصفّحات قبل استخدام هذا التّابع في شيفرة إنتاجيّة.
يعيد التّابع Document.elementFromPoint() العنصر الموجود في أعلى الإحداثيّات المعطاة (حسب إطار العرض [viewport]).
إن كان العنصر في النّقطة المحدّدة خاصًّا بمستند آخر (مثل مستند فرعيّ لعنصر iframe مثلًا)، فالعنصر الأب للمستند الفرعيّ هو الذي يُعاد (أي عنصر iframe نفسه). إن كان العنصر في النّقطة المُعطاة مجهولًا (anonymous) أو محتوًى مولَّدًا عبر XBL، مثل شريط التمرير (scroll bar) في صندوقٍ نصيّ، فأول عنصرٍ أبٍ غير مجهولٍ هو الذي يُعاد (الصّندوق النّصيّ مثلًا).
إن كانت النّقطة المعطاة خارج حدود المستند الظّاهرة، أو كان أحد الإحداثيّات سلبيًّا، فالنّتيجة ستكون القيمة null.
إن أردت أن تجد الموقع المحدّد بالضّبط داخل العنصر، فاستخدم التّابع Document.caretPositionFromPoint().
البنية العامة
var element = document.elementFromPoint(x, y);
x
الإحداثيّات الأفقيّة لنقطة ما.
y
الإحداثيّات الرأسية لنقطة ما.
القيمة المعادة
كائن من النّوع Element يمثّل أعلى عنصر تحت النّقطتين المعطاتين.
مثال
<!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>
دعم المتصفّحات
| الميزة | Chrome | Firefox | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|
| الدعم الأساسي | 53 | نعم | نعم | 40 | نعم |
مصادر ومواصفات
- مواصفة Shadow DOM