المحدد :parent
في jQuery
المحدِّد :parent
الوصف
يختار هذا المحدِّد جميع العناصر التي لها ابن واحد على الأقل (بما في ذلك العقد النصية).
jQuery( ":parent" )
أُضيف مع الإصدار: 1.0.
هذا المحدِّد هو عكس المحدِّد :empty
تمامًا.
يجب ملاحظة شيء واحد مهم مع المحدِّد :parent
(والمحدِّد :empty
) وهو أنَّ العناصر الأبناء قد تتضمن عقد نصية. توصي W3C بأن يحتوي العنصر <p>
على عقدة ابن واحدة على الأقل، حتى لو كان هذا الابن مجرد نص (راجع https://www.w3.org/TR/html401/struct/text.html#edef-P). من ناحية أخرى، تكون بعض العناصر الأخرى فارغة (أي ليس لها أبناء) بالتعريف مثل العناصر <input>
و <img>
و <br>
و <hr>
.
للحصول على العنصر الأب أو العناصر الأجداد (ancestors) لمجموعة jQuery الحالية، استعمل التابع .arent()
والتابع .parents()
.
ملاحظات إضافية
لمَّا كان المحدِّد :parent
هو ملحق في مكتبة jQuery وليس جزءًا من مواصفة CSS، فإنَّ الاستعلامات التي تستعمل :parent
لا يمكنها الاستفادة من سرعة الأداء الذي يوفره تابع DOM الأصلي querySelectorAll()
. للحصول على أداء أفضل في المتصفحات الحديثة، حدِّد العناصر باستعمال محدِّدات CSS الصرفة (pure) ثمَّ استعمل التابع .filter(" :parent ")
.
أمثلة
إيجاد جميع العناصر <td>
التي لها أبناء (من ضمنها العقد النصية):
<!doctype html>
<html lang="ar">
<head>
<meta charset="utf-8">
<title>parent مثالٌ عن استعمال المحدد</title>
<style>
td {
width: 40px;
background: green;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<table border="1">
<tr><td>القيمة 1</td><td></td></tr>
<tr><td>القيمة 2</td><td></td></tr>
</table>
<script>
$( "td:parent" ).fadeTo( 1500, 0.3 );
</script>
</body>
</html>