الفرق بين المراجعتين ل"jQuery/last selector"
< jQuery
اذهب إلى التنقل
اذهب إلى البحث
جميل-بيلوني (نقاش | مساهمات) |
|||
| سطر 16: | سطر 16: | ||
إيجاد السطر <code>[[HTML/tr|<nowiki><tr></nowiki>]]</code> الأخير في جدول <code>[[HTML/table|<nowiki><table></nowiki>]]</code>:<syntaxhighlight lang="html"> | إيجاد السطر <code>[[HTML/tr|<nowiki><tr></nowiki>]]</code> الأخير في جدول <code>[[HTML/table|<nowiki><table></nowiki>]]</code>:<syntaxhighlight lang="html"> | ||
<!doctype html> | <!doctype html> | ||
| − | <html lang=" | + | <html lang="ar"> |
<head> | <head> | ||
<meta charset="utf-8"> | <meta charset="utf-8"> | ||
| − | <title>last | + | <title>last مثالٌ عن استعمال المحدد</title> |
<script src="https://code.jquery.com/jquery-1.10.2.js"></script> | <script src="https://code.jquery.com/jquery-1.10.2.js"></script> | ||
</head> | </head> | ||
| سطر 25: | سطر 25: | ||
<table> | <table> | ||
| − | <tr><td> | + | <tr><td>السطر الأول</td></tr> |
| − | <tr><td> | + | <tr><td>اسطر الأوسط</td></tr> |
| − | <tr><td> | + | <tr><td>السطر الأخير</td></tr> |
</table> | </table> | ||
المراجعة الحالية بتاريخ 10:01، 4 يونيو 2018
المحدد :last
الوصف
يختار هذا المحدِّد العنصر الأخير المتطابق.
jQuery( ":last" )
أُضيف مع الإصدار: 1.0.
لاحظ أن المحدِّد :last يحدِّد عنصرًا واحدًا عبر ترشيح مجموعة jQuery الحالية ويطابق العنصر الأخير ضمنها.
ملاحظات إضافية
لما كان المحدد :last ملحقًا في مكتبة jQuery وليس جزءًا من مواصفة CSS، فإن الاستعلامات التي تستخدم :last لن تستفيد من سرعة الأداء الذي يوفرها تابع DOM الأصلي querySelectorAll(). للحصول على أفضل أداء عند استعمال المحدد :last لاختيار العناصر، حدِّد أولًا العناصر باستعمال محدد CSS الصرف (pure) ثمَّ استعمل .filter(":last").
أمثلة
إيجاد السطر <tr> الأخير في جدول <table>:
<!doctype html>
<html lang="ar">
<head>
<meta charset="utf-8">
<title>last مثالٌ عن استعمال المحدد</title>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<table>
<tr><td>السطر الأول</td></tr>
<tr><td>اسطر الأوسط</td></tr>
<tr><td>السطر الأخير</td></tr>
</table>
<script>
$( "tr:last" ).css({ backgroundColor: "yellow", fontWeight: "bolder" });
</script>
</body>
</html>