الفرق بين المراجعتين لصفحة: «jQuery/descendant selector»

من موسوعة حسوب
أنشأ الصفحة ب'<noinclude>{{DISPLAYTITLE:التابع <code>Descendant Selector (“ancestor descendant”) == ‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎Descendant...'
 
لا ملخص تعديل
 
(10 مراجعات متوسطة بواسطة مستخدمين اثنين آخرين غير معروضة)
سطر 1: سطر 1:
<noinclude>{{DISPLAYTITLE:التابع <code>Descendant Selector (“ancestor descendant”)
<noinclude>{{DISPLAYTITLE:‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎محدد العناصر السليلة في jQuery}}</noinclude>
== ‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎Descendant Selector (“ancestor descendant”)==
== ‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎محدد العناصر السليلة ("ancestor descendant") ==


=== الوصف ===
=== الوصف ===
يختار جميع العناصر التي تنتمي إلى سلف معين.
يُحدِد جميع العناصر التي تنتمي إلى سلف معين.


=== <code>jQuery( "ancestor descendant" )‎</code> ===
=== <code>jQuery( "ancestor descendant" )‎</code> ===
سطر 12: سطر 12:


==== <code>Descendant</code> ====
==== <code>Descendant</code> ====
محدد لتصفية العناصر التابعة.
محدد لتصفية العناصر السليلة.


يمكن أن يكون الـ descendant لعنصرٍ ما هو إبن هذا العنصر، أو حفيده، أو ابن الحفيد، وهكذا.
يمكن أن يكون سليل عنصرٍ ما هو إبن هذا العنصر، أو حفيده، أو ابن الحفيد، وهكذا.


=== أمثلة ===
=== أمثلة ===
وضع علامة على كافة المدخلات التي هي جزءٌ نموذج له حدود زرقاء منقط. وإعطاء خلفية صفراء لإدخالات الـ descendants الخاصة بمجموعة حقول descendant من النموذج.<syntaxhighlight lang="html">
تنسيق كافة حقول الإدخال <code>[[HTML/input|<input>]]</code> السليلة من نموذج <code>[[HTML/form|<form>]]</code> بإضافة إطارٍ ذي لونٍ أزرق ونمط خطه منقط. وإعطاء خلفية صفراء لحقول الإدخال <code>[[HTML/input|<input>]]</code> السليلة من مجموعة حقول <code>[[HTML/fieldset|<fieldset>]]</code> سليلة من نموذج <code>[[HTML/form|<form>]]</code>:<syntaxhighlight lang="html">
<!doctype html>
<!doctype html>
<html lang="en">
<html lang="en">
سطر 43: سطر 43:
   
   
<form>
<form>
   <div>Form is surrounded by the green border.</div>
   <div>النموذج محاط بإطار أخضر.</div>
   
   
   <label for="name">Child of form:</label>
   <label for="name">إبن النموذج:</label>
   <input name="name" id="name">
   <input name="name" id="name">
   
   
   <fieldset>
   <fieldset>
     <label for="newsletter">Grandchild of form, child of fieldset:</label>
     <label for="newsletter">ابن ابن النموذج، ابن عنصر fieldset:</label>
     <input name="newsletter" id="newsletter">
     <input name="newsletter" id="newsletter">
   </fieldset>
   </fieldset>
</form>
</form>مثيل النموذج: <input name="none">
Sibling to form: <input name="none">
   
   
<script>
<script>
سطر 65: سطر 64:


== مصادر ==
== مصادر ==
[http://api.jquery.com/descendant-selector/ صفحة التابع ‎Descendant Selector (“ancestor descendant”)‎‎ في توثيق jQuery الرسمي].
[http://api.jquery.com/descendant-selector/ صفحة ‎Descendant Selector في توثيق jQuery الرسمي].
[[تصنيف:jQuery]]
[[تصنيف:jQuery]]
[[تصنيف:jQuery Method]]
[[تصنيف:jQuery Selectors]]
[[[[تصنيف:jQuery Selectors]]
[[[[تصنيف:jQuery Hierarchy]]

المراجعة الحالية بتاريخ 14:10، 5 يونيو 2018

‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎‎محدد العناصر السليلة ("ancestor descendant")

الوصف

يُحدِد جميع العناصر التي تنتمي إلى سلف معين.

jQuery( "ancestor descendant" )‎

أُضيف مع الإصدار: 1.0.

ancestor

أي مُحدِد صالح.

Descendant

محدد لتصفية العناصر السليلة.

يمكن أن يكون سليل عنصرٍ ما هو إبن هذا العنصر، أو حفيده، أو ابن الحفيد، وهكذا.

أمثلة

تنسيق كافة حقول الإدخال <input> السليلة من نموذج <form> بإضافة إطارٍ ذي لونٍ أزرق ونمط خطه منقط. وإعطاء خلفية صفراء لحقول الإدخال <input> السليلة من مجموعة حقول <fieldset> سليلة من نموذج <form>:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>descendant demo</title>
  <style>
  form {
    border: 2px green solid;
    padding: 2px;
    margin: 0;
    background: #efe;
  }
  div {
    color: red;
  }
  fieldset {
    margin: 1px;
    padding: 3px;
  }
  </style>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
 
<form>
  <div>النموذج محاط بإطار أخضر.</div>
 
  <label for="name">إبن النموذج:</label>
  <input name="name" id="name">
 
  <fieldset>
    <label for="newsletter">ابن ابن النموذج، ابن عنصر fieldset:</label>
    <input name="newsletter" id="newsletter">
  </fieldset>
</form>مثيل النموذج: <input name="none">
 
<script>
$( "form input" ).css( "border", "2px dotted blue" );
$( "form fieldset input" ).css( "backgroundColor", "yellow" );
</script>
 
</body>
</html>

مصادر

صفحة ‎Descendant Selector في توثيق jQuery الرسمي.