الفرق بين المراجعتين لصفحة: «jQuery/first selector»
< jQuery
Khaled-yassin (نقاش | مساهمات) أنشأ الصفحة ب'<noinclude>{{DISPLAYTITLE:المحدد <code>:first()</code> في jQuery}}</noinclude> == المحدد...' |
|||
| (3 مراجعات متوسطة بواسطة مستخدمين اثنين آخرين غير معروضة) | |||
| سطر 1: | سطر 1: | ||
<noinclude>{{DISPLAYTITLE:المحدد <code>:first | <noinclude>{{DISPLAYTITLE:المحدد <code>:first</code> في jQuery}}</noinclude> | ||
== المحدد <code>:first</code> == | == المحدد <code>:first</code> == | ||
| سطر 8: | سطر 8: | ||
أُضيف مع الإصدار: [http://api.jquery.com/category/version/1.0 1.0]. | أُضيف مع الإصدار: [http://api.jquery.com/category/version/1.0 1.0]. | ||
يعادل مُحدد | يعادل مُحدد الصنف الزائف <code>:first</code> المحدد <code>[[jQuery/eq selector|:eq( 0 )]]</code>. ويمكن أيضًا أن يُكتب على النحو <code>[[jQuery/lt selector|:lt( 1 )]]</code>. في حين أن هذا لا يتطابق إلا مع عنصر واحد فقط : يمكن أن يتطابق المُحدد <code>[[jQuery/first child selector|:first-child]]</code> مع أكثر من عنصر بواقع عنصر واحد لكل أب. | ||
=== ملاحظات إضافية === | === ملاحظات إضافية === | ||
لأن <code>:first</code> هو ملحق jQuery وليس جزءًا من مواصفات CSS، فلا يمكن استفادة الاستعلامات | لأن <code>:first</code> هو ملحق jQuery وليس جزءًا من مواصفات CSS، فلا يمكن استفادة الاستعلامات التي تستخدم <code>:first</code> من تحسين الأداء الذي يوفره تابع DOM الأصلي <code>[[JavaScript/Document/querySelectorAll|querySelectorAll()]]</code>. لتحقيق أفضل أداء عند استخدام <code>:first</code> لتحديد العناصر، حدد أولاً العناصر باستخدام محدد CSS، ثم استخدم <code>[[jQuery/filter|.filter(":first")]]</code> . | ||
تأتي العناصر المحددة في نفس ترتيب ظهورها في المستند. | تأتي العناصر المحددة في نفس ترتيب ظهورها في المستند. | ||
=== أمثلة === | === أمثلة === | ||
تحديد أول صف في الجدول الآتي:<syntaxhighlight lang="html"> | |||
<!doctype html> | |||
<html lang="en"> | |||
<head> | |||
<meta charset="utf-8"> | |||
<title>first demo</title> | |||
<style> | |||
td { | |||
color: blue; | |||
font-weight: bold; | |||
} | |||
</style> | |||
<script src="https://code.jquery.com/jquery-1.10.2.js"></script> | |||
</head> | |||
<body> | |||
<table> | |||
<tr><td>Row 1</td></tr> | |||
<tr><td>Row 2</td></tr> | |||
<tr><td>Row 3</td></tr> | |||
</table> | |||
<script> | |||
$( "tr:first" ).css( "font-style", "italic" ); | |||
</script> | |||
</body> | |||
</html> | |||
</syntaxhighlight> | |||
== مصادر == | == مصادر == | ||
* [http://api.jquery.com/first-selector/ صفحة المحدد :first | * [http://api.jquery.com/first-selector/ صفحة المحدد :first في توثيق jQuery الرسمي]. | ||
[[تصنيف:jQuery]] | [[تصنيف:jQuery]] | ||
[[تصنيف:jQuery Selectors]] | [[تصنيف:jQuery Selectors]] | ||
المراجعة الحالية بتاريخ 10:23، 17 مايو 2018
المحدد :first
الوصف
يحدد أول عنصر DOM متطابق.
jQuery( ":first" )
أُضيف مع الإصدار: 1.0.
يعادل مُحدد الصنف الزائف :first المحدد :eq( 0 ). ويمكن أيضًا أن يُكتب على النحو :lt( 1 ). في حين أن هذا لا يتطابق إلا مع عنصر واحد فقط : يمكن أن يتطابق المُحدد :first-child مع أكثر من عنصر بواقع عنصر واحد لكل أب.
ملاحظات إضافية
لأن :first هو ملحق jQuery وليس جزءًا من مواصفات CSS، فلا يمكن استفادة الاستعلامات التي تستخدم :first من تحسين الأداء الذي يوفره تابع DOM الأصلي querySelectorAll(). لتحقيق أفضل أداء عند استخدام :first لتحديد العناصر، حدد أولاً العناصر باستخدام محدد CSS، ثم استخدم .filter(":first") .
تأتي العناصر المحددة في نفس ترتيب ظهورها في المستند.
أمثلة
تحديد أول صف في الجدول الآتي:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>first demo</title>
<style>
td {
color: blue;
font-weight: bold;
}
</style>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<table>
<tr><td>Row 1</td></tr>
<tr><td>Row 2</td></tr>
<tr><td>Row 3</td></tr>
</table>
<script>
$( "tr:first" ).css( "font-style", "italic" );
</script>
</body>
</html>